# Setting visible to false doesn't set element height to zero

**URL:** <https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637>\
**Category:** Questions about Thunkable X\
**Tags:** design\
**Created:** [May 3, 2020, 9:45am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637 "2020-05-03T09:45:20Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![niloc668](https://avatars.discourse-cdn.com/v4/letter/n/d2c977/32.png) [@niloc668](https://community.thunkable.com/u/niloc668)\
**Post date:** [May 3, 2020, 9:45am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/1 "2020-05-03T09:45:20Z")

</div>

Hi all,

Did a bunch of searching over the last several weeks and couldn’t find this exact dilemma:

When you set a row/column to Visible: False on a scrollable screen, the element still takes up space on the screen but just isn’t visible i.e. you just see a white space rather than nothing.

_ **EDIT: This may be an iOS only problem** _

Example here using the Thunkable Scrollable Example:

[https://x.thunkable.com/copy/fad850936a0c00ac424d68a1549083d7](https://x.thunkable.com/copy/fad850936a0c00ac424d68a1549083d7)

There is a button at the bottom of the screen that has Visible: False set so you can’t see it but can clearly see on preview on phone that something is taking up space i.e. the container, you just can’t see the element inside the container. When you delete those non-visible buttons, the whitespace is reclaimed so the row is definitely “visible” in a sense

Is there any way around this so that the Visibility functions as if the element is truly “gone” i.e. not taking up space at all (height = 0) and not just replaced by whitespace?

Many thanks,

 ![8d67d681-4788-4885-a6d6-8a4be38af9e9](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/e/b/ebf6f4320cd4b8acc1032a91eb6d61cb8fa34467.jpeg)

---

<div class="post-metadata">

**Author:** ![towball](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/towball/32/68409_2.png) [@towball](https://community.thunkable.com/u/towball)\
**Post date:** [May 3, 2020, 10:34am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/2 "2020-05-03T10:34:23Z")

</div>

Hi  
Try this  
Inserted a Row7 to hold the buttons with absolute height 35 so we can see them  
Move buttons into Row7  
Make buttons visible  
Blocks for buttons add Button 2 visible = true  
Screen 3 change to scrollable  
Column1 change to not scrollable

![2020-05-03 20_30_49-Thunkable](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/3/1/31b5fb21af0d074e586d155782e7689500f84eea.png)

![2020-05-03 20_35_39-Thunkable](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/8/c/8cad41a0ac1ff7ad8ca0a20aa885cf84b3519789.png)

Regards

Towball

---

<div class="post-metadata">

**Author:** ![niloc668](https://avatars.discourse-cdn.com/v4/letter/n/d2c977/32.png) [@niloc668](https://community.thunkable.com/u/niloc668)\
**Post date:** [May 3, 2020, 10:59am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/3 "2020-05-03T10:59:09Z")

</div>

Hi Towball,

Thanks very much for your response. Unfortunately, when I do that on my phone in live preview, you’ll find you can’t scroll down to see the fourth beaver. Like there is content down there and you can kind of drag it up but you can’t actually scroll down to it properly.

Annoyingly, on the computer live preview you can scroll down just fine as you’d expect it to behave but when you actually do the preview on mobile it doesn’t work. Like your solution works for the computer live preview mode but not on the actual mobile app unfortunately.

Not sure if this is a bug or not or if there is some sort of other solution?

---

<div class="post-metadata">

**Author:** ![towball](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/towball/32/68409_2.png) [@towball](https://community.thunkable.com/u/towball)\
**Post date:** [May 3, 2020, 11:05am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/4 "2020-05-03T11:05:50Z")

</div>

I had the same issue on an IOS device, could scroll to the buttons at the bottom but the screen kept popping back up.  
My fix was to add a row at the bottom of the screen, colored it to suit the App. Made the the row absolute height of 35 px

---

<div class="post-metadata">

**Author:** ![niloc668](https://avatars.discourse-cdn.com/v4/letter/n/d2c977/32.png) [@niloc668](https://community.thunkable.com/u/niloc668)\
**Post date:** [May 3, 2020, 11:14am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/5 "2020-05-03T11:14:35Z")

</div>

Hmmm, I wonder if this should be retitled:

Can’t scroll to bottom of scrollable screen content with iOS then…

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [May 3, 2020, 12:03pm UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/6 "2020-05-03T12:03:40Z")

</div>

Add a buffer to the bottom of the screen may work too

---

<div class="post-metadata">

**Author:** ![niloc668](https://avatars.discourse-cdn.com/v4/letter/n/d2c977/32.png) [@niloc668](https://community.thunkable.com/u/niloc668)\
**Post date:** [May 3, 2020, 1:10pm UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/7 "2020-05-03T13:10:21Z")

</div>

Hi jared,

Do you mean just adding a blank row as towball has suggested?

---

<div class="post-metadata">

**Author:** ![towball](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/towball/32/68409_2.png) [@towball](https://community.thunkable.com/u/towball)\
**Post date:** [May 4, 2020, 6:21am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/8 "2020-05-04T06:21:29Z")

</div>

Yes many ways to do it

- add a row about 35 px
- add a label
- add spacing on the bottom margin as per the image on Screen3

If this solves your problem please mark as resolved/solution

 ![Spacing](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/4/6/46d6afc2000813881d1cc804539bf3f2a4d004cd.png)

---

<div class="post-metadata">

**Author:** ![niloc668](https://avatars.discourse-cdn.com/v4/letter/n/d2c977/32.png) [@niloc668](https://community.thunkable.com/u/niloc668)\
**Post date:** [May 4, 2020, 9:46am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/9 "2020-05-04T09:46:04Z")

</div>

This feels like a bug then no?

“I.e. Scrollable Screen not showing all content on iOS devices” but works fine on Android?

Because if I insert the ghost element at the bottom at the page that will help push the content up on iOS but then will just be a blank space on Android when you get to the bottom, a better problem obviously but still a problem.

Also, the difference in height of the element won’t necessarily be consistent, i.e. it’s not always 35px off the screen, sometimes it is much more if there is a greater amount of scrollable content. Effectively, this means you can’t really use a scrollable screen for iOS, especially as you have no way of knowing how much is cut off on different screen sizes (unless you have multiple test units at hand).

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [May 4, 2020, 11:26am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/10 "2020-05-04T11:26:40Z")

</div>

This is a bug that has been reported on Github I believe. If not, you could post it there.

---

<div class="post-metadata">

**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, 11:29am UTC](https://community.thunkable.com/t/setting-visible-to-false-doesnt-set-element-height-to-zero/564637/12 "2024-11-08T11:29:29Z")

</div>


