# How to set image height to width percentage **URL:** \ **Category:** Questions about Thunkable X\ **Created:** [June 18, 2018, 5:40pm UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133 "2018-06-18T17:40:29Z")\ **Posts on this page:** 12\ **Page:** 1
**Author:** ![Louis\_Cassany](https://avatars.discourse-cdn.com/v4/letter/l/d6d6ee/32.png) [@Louis\_Cassany](https://community.thunkable.com/u/Louis_Cassany)\ **Post date:** [June 18, 2018, 5:40pm UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/1 "2018-06-18T17:40:29Z")
Hello ! I’m using thunkable cross platform. I would like to set an image height to be the same as the current image width, that is set in percentage. My issue is that is I set the image width and height to be 20%, the image won’t be square since 20% of the container’s width is not equal to 20% of the container’s height. I don’t want to use absolute scaling since I want the width to change according to the width of the screen. Any idea about how to proceed ? Thanks ---
**Author:** ![Kyle\_Williams](https://avatars.discourse-cdn.com/v4/letter/k/b2d939/32.png) [@Kyle\_Williams](https://community.thunkable.com/u/Kyle_Williams)\ **Post date:** [June 19, 2018, 1:38am UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/2 "2018-06-19T01:38:50Z")
I don’t believe this is currently possible. I tried getting the height of a 20% tall box to see if it _might_ return an absolute height (that we could then assign to width), but it also pulls a percentage. ---
**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\ **Post date:** [June 19, 2018, 6:03am UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/3 "2018-06-19T06:03:04Z")
Hello, You can try to display an image in the Web Viewer using JavaScript. ---
**Author:** ![Louis\_Cassany](https://avatars.discourse-cdn.com/v4/letter/l/d6d6ee/32.png) [@Louis\_Cassany](https://community.thunkable.com/u/Louis_Cassany)\ **Post date:** [June 19, 2018, 6:13am UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/4 "2018-06-19T06:13:47Z")
I could do that but Thinkable is about about making aps without worrying about coding anything… I would have used phonegap if I wanted to take care of JS and HTML. I managed to do something, by putting the aspect ratio to 1 (in advanced options) and by specifying a relative width and leaving the height blank. It seems to work but isn’t very intuitive… ---
**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\ **Post date:** [June 19, 2018, 6:30am UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/5 "2018-06-19T06:30:21Z")
When in Thunkable X there is an exchange of data between the Web Viewer and the native part, then, perhaps, you change your mind. Even App Inventror + Javascript is much more functional and more powerful than Phonegap. Thunkable X appeared quite recently and many things really have to be done intuitively and apply different tricks. ---
**Author:** ![Louis\_Cassany](https://avatars.discourse-cdn.com/v4/letter/l/d6d6ee/32.png) [@Louis\_Cassany](https://community.thunkable.com/u/Louis_Cassany)\ **Post date:** [June 19, 2018, 7:35am UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/6 "2018-06-19T07:35:54Z")
What can you do in MIT app inventor that you can’t do with HTML/CSS/JS ? I didn’t realize that Thunkable X was this new, they should consider adding an option to be able to get the absolute width of a component (instead of returning “20%”), this should be really helpfull for new people that doesn’t know HTML/JS (because that’s what thunkable is meant for). ---
**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\ **Post date:** [June 19, 2018, 8:43am UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/7 "2018-06-19T08:43:50Z")
In App Inventor, I can work with native device functionality, use Java in extensions, create Android API objects and methods, etc., which can not be done with HTML/CSS/JS. You’re right,. I was also very surprised that the blocks in Thunkable X do not return the current values ​​of the properties. ---
**Author:** ![Louis\_Cassany](https://avatars.discourse-cdn.com/v4/letter/l/d6d6ee/32.png) [@Louis\_Cassany](https://community.thunkable.com/u/Louis_Cassany)\ **Post date:** [June 19, 2018, 9:06am UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/8 "2018-06-19T09:06:19Z")
I believe that Cordova allows you to work with native functionality but can sometimes be a bit tricky to manipulate… I didn’t know you could go this far with appinventor, thanks for the info ! ---
**Author:** ![Rob\_Schoemaker](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/rob_schoemaker/32/21023_2.png) [@Rob\_Schoemaker](https://community.thunkable.com/u/Rob_Schoemaker)\ **Post date:** [June 29, 2018, 7:41pm UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/9 "2018-06-29T19:41:40Z")
Hi In the advanced tab, if you set one of the dimensions in % and leave the other blank (e.g. set width to 20% and leave height blank), it will automatically set the other dimension to the same value. So if you set width to 20% and leave height blank, both sides of the image will be 20% of the width of the container the image is in. On the other hand, if you set the height to 20% and leave the width blank, both sides of the image will be 20% of the height of the container. You can also put constraints on it like minimal/maximal width/height. There also is a parameter aspect ratio, which I assume can be used to specify the ratio between width and height (e.g to make the width half the height, but that doesn’t seem to work at present) Regards Rob ---
**Author:** ![Hayder](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/hayder/32/153829_2.png) [@Hayder](https://community.thunkable.com/u/Hayder)\ **Post date:** [July 20, 2018, 4:13pm UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/10 "2018-07-20T16:13:20Z")
Set any height and width percent but use “contain” for the picture. Then you picture will stay square forever. Hayder ---
**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\ **Post date:** [July 20, 2018, 4:15pm UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/11 "2018-07-20T16:15:50Z")
I see a problem with the buttons on the hidden Column. Do you want to do this - cover all the buttons in Column with an opaque Column with absolute positioning? ---
**Author:** ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)\ **Post date:** [November 8, 2024, 12:01pm UTC](https://community.thunkable.com/t/how-to-set-image-height-to-width-percentage/32133/12 "2024-11-08T12:01:12Z")