# Hidden Group Causing Header To Expand Height

**URL:** <https://forum.bubble.io/t/hidden-group-causing-header-to-expand-height/10056>\
**Category:** Responsiveness\
**Created:** [January 31, 2017, 3:03am UTC](https://forum.bubble.io/t/hidden-group-causing-header-to-expand-height/10056 "2017-01-31T03:03:52Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![chrisschrade](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/chrisschrade/32/241480_2.png) [@chrisschrade](https://forum.bubble.io/u/chrisschrade)\
**Post date:** [January 31, 2017, 3:03am UTC](https://forum.bubble.io/t/hidden-group-causing-header-to-expand-height/10056/1 "2017-01-31T03:03:53Z")

</div>

Have a group of Nav buttons when page is more than 668 pxls, when less it hides and a sidebar menu sandwich appears - but as the page collapses that hidden group causes the header to increase in size and the sandwich icon to move to a line underneath.

I would like the header to maintain its height (appx 150 pxls) and the sandwich to right align but push closer to logo as page collapses.

Any suggestions?

 ![](https://us1.discourse-cdn.com/bubble/original/2X/0/0bf2e53dc0450e6e08818538fb7482bba9ed7d50.png)

---

<div class="post-metadata">

**Author:** ![1danielbaker](https://avatars.discourse-cdn.com/v4/letter/1/d26b3c/32.png) [@1danielbaker](https://forum.bubble.io/u/1danielbaker)\
**Post date:** [January 31, 2017, 3:16am UTC](https://forum.bubble.io/t/hidden-group-causing-header-to-expand-height/10056/2 "2017-01-31T03:16:55Z")

</div>

Have you tried selecting the option to “collapse the group when hidden” ? That may do it for you.

---

<div class="post-metadata">

**Author:** ![chrisschrade](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/chrisschrade/32/241480_2.png) [@chrisschrade](https://forum.bubble.io/u/chrisschrade)\
**Post date:** [January 31, 2017, 3:39am UTC](https://forum.bubble.io/t/hidden-group-causing-header-to-expand-height/10056/3 "2017-01-31T03:39:56Z")

</div>

@1danielbaker - do you mean "collapse margins when container width \<= " - I had this activated in the previous photo but it was not behaving as I thought. I don’t see the exact option you mentioned.

 ![](https://us1.discourse-cdn.com/bubble/original/2X/7/7ded38294a9790fa6baec0dff3c9e915ef1c806c.png)

---

<div class="post-metadata">

**Author:** ![1danielbaker](https://avatars.discourse-cdn.com/v4/letter/1/d26b3c/32.png) [@1danielbaker](https://forum.bubble.io/u/1danielbaker)\
**Post date:** [January 31, 2017, 3:49am UTC](https://forum.bubble.io/t/hidden-group-causing-header-to-expand-height/10056/4 "2017-01-31T03:49:41Z")

</div>

I was referring to the actual element setting (the group)

 ![](https://us1.discourse-cdn.com/bubble/original/2X/b/bb66f60b59b69057cc2a51b1737da44ae8a7a022.png)

The bottom check in this picture

---

<div class="post-metadata">

**Author:** ![chrisschrade](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/chrisschrade/32/241480_2.png) [@chrisschrade](https://forum.bubble.io/u/chrisschrade)\
**Post date:** [January 31, 2017, 3:53am UTC](https://forum.bubble.io/t/hidden-group-causing-header-to-expand-height/10056/5 "2017-01-31T03:53:43Z")

</div>

Yeah tried it did not work - I almost feel like there should be a “collapse this elements width” - thats what I feel I need - but I’m sure I’m missing something.

---

<div class="post-metadata">

**Author:** ![mishav](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/mishav/32/6420_2.png) [@mishav](https://forum.bubble.io/u/mishav)\
**Post date:** [February 1, 2017, 4:35pm UTC](https://forum.bubble.io/t/hidden-group-causing-header-to-expand-height/10056/6 "2017-02-01T16:35:25Z")

</div>

What its trying to do is keep the margins as big as possible. One workaround for this is to fill the horizontal gap between elements.with a group or shape that has min width 0%.

The other thing is to make the group hide, not just “be an invisible elephant”, try the “Add hiding rule” on the responsive screen settings (fourth line in your screenshot). It depends solely on page width or container width (can’t remember which haha). You may then no longer need to set the visibility setting.

---

<div class="post-metadata">

**Author:** ![chrisschrade](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/chrisschrade/32/241480_2.png) [@chrisschrade](https://forum.bubble.io/u/chrisschrade)\
**Post date:** [February 1, 2017, 4:40pm UTC](https://forum.bubble.io/t/hidden-group-causing-header-to-expand-height/10056/7 "2017-02-01T16:40:45Z")

</div>

@mishav - For some reason the “Add hiding rule” didn’t work at first. I tried a few days ago and had similar results…tried again this morning on a whim and it was indeed the fix!

Thank you @mishav and @1danielbaker