# Minimum height 100%

**URL:** <https://forum.bubble.io/t/minimum-height-100/261894>\
**Category:** Questions\
**Created:** [May 9, 2023, 3:47pm UTC](https://forum.bubble.io/t/minimum-height-100/261894 "2023-05-09T15:47:53Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![fabian.banushi](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/fabian.banushi/32/135641_2.png) [@fabian.banushi](https://forum.bubble.io/u/fabian.banushi)\
**Post date:** [May 9, 2023, 3:47pm UTC](https://forum.bubble.io/t/minimum-height-100/261894/1 "2023-05-09T15:47:53Z")

</div>

How to make the Minimum height 100% with CSS when with native bubble doesn’t work?

![image](https://us1.discourse-cdn.com/bubble/original/3X/d/0/d0b49c146906feb765da649667ea537f9b664261.png)

Thanks  
Fabian

---

<div class="post-metadata">

**Author:** ![Newed](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/newed/32/262530_2.png) [@Newed](https://forum.bubble.io/u/Newed)\
**Post date:** [May 9, 2023, 3:53pm UTC](https://forum.bubble.io/t/minimum-height-100/261894/2 "2023-05-09T15:53:38Z")

</div>

What are you trying to do? When using % the height or width of the element will be proportional to the height or width of the parent container, so you may need to manipulate the parent element.

---

<div class="post-metadata">

**Author:** ![S2294](https://avatars.discourse-cdn.com/v4/letter/s/5f8ce5/32.png) [@S2294](https://forum.bubble.io/u/S2294)\
**Post date:** [May 9, 2023, 3:58pm UTC](https://forum.bubble.io/t/minimum-height-100/261894/3 "2023-05-09T15:58:32Z")

</div>

I don’t think you need CSS as you can do this natively with Bubble, if I’m not mistaken.

This solution helped me achieve something similar, or the same [100vh or 100% height of a container and the editor](http://forum.bubble.io/t/100vh-or-100-height-of-a-container-and-the-editor/192752)

---

<div class="post-metadata">

**Author:** ![fabian.banushi](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/fabian.banushi/32/135641_2.png) [@fabian.banushi](https://forum.bubble.io/u/fabian.banushi)\
**Post date:** [May 9, 2023, 4:00pm UTC](https://forum.bubble.io/t/minimum-height-100/261894/4 "2023-05-09T16:00:00Z")

</div>

yeah… I know… the parent is also 100% and it is a FloatGroup  
basically a menu (in mobile preview) showing up… I want the background to fill the rest of the page

---

<div class="post-metadata">

**Author:** ![stuart4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/stuart4/32/250415_2.png) [@stuart4](https://forum.bubble.io/u/stuart4)\
**Post date:** [May 9, 2023, 8:10pm UTC](https://forum.bubble.io/t/minimum-height-100/261894/5 "2023-05-09T20:10:21Z")

</div>

Maybe this will

> [@Floating Group with header and footer](http://forum.bubble.io/t/floating-group-with-header-and-footer/254920):
>
> This is a pretty simple thing to do but may be confusing if you think you need nested floating groups for this kind of effect (which i did for a minute). [firefox\_DTf047KeNt] To do this, create a floating group with a column layout [image] [image] create 3 groups - one for the header, one for the middle and one for the footer. [image] Make the Group Tabs, and Group Footer the desired height. The Group Content is where the magic happens - set this to container layout of column, this is wh…

---

<div class="post-metadata">

**Author:** ![fabian.banushi](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/fabian.banushi/32/135641_2.png) [@fabian.banushi](https://forum.bubble.io/u/fabian.banushi)\
**Post date:** [May 9, 2023, 8:17pm UTC](https://forum.bubble.io/t/minimum-height-100/261894/6 "2023-05-09T20:17:20Z")

</div>

Thanks… I actually need that for another thing 😃  
Maybe it will work also for that that I’m asking