# Hide the 3 bar menu on a mobile in foundry?

**URL:** <https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265>\
**Category:** RapidWeaver Classic\
**Created:** [April 12, 2019, 7:10am UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265 "2019-04-12T07:10:43Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jonline](https://avatars.discourse-cdn.com/v4/letter/j/9d8465/32.png) [@Jonline](https://forums.realmacsoftware.com/u/Jonline)\
**Post date:** [April 12, 2019, 7:10am UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/1 "2019-04-12T07:10:43Z")

</div>

I’ve a one page site, built in foundry, In the mobile view I have the 3 bars, in the top right. I’ve looked but can only find this below, which appears not to work on the mobile version?. Do I need to use different code?

Any help would be great. Thanks Jon

Doug Bennett - RapidWeaver Pro  
add this CSS to the site-wide settings:

header.navbar {  
display:none;  
}

 ![ONE%20PAGE](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/2X/e/eb50fb19211262430c56f4d4a56c17ff6fb49571.jpeg)

---

<div class="post-metadata">

**Author:** ![NeilUK](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/neiluk/32/23434_2.png) [@NeilUK](https://forums.realmacsoftware.com/u/NeilUK)\
**Post date:** [April 12, 2019, 7:12am UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/2 "2019-04-12T07:12:30Z")

</div>

Can you provide a link to the website? Very difficult to find the correct code to target without it.

---

<div class="post-metadata">

**Author:** ![Jonline](https://avatars.discourse-cdn.com/v4/letter/j/9d8465/32.png) [@Jonline](https://forums.realmacsoftware.com/u/Jonline)\
**Post date:** [April 12, 2019, 12:29pm UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/3 "2019-04-12T12:29:26Z")

</div>

Thanks Neil.  
Its here…

> **[the-train-station\_personal\_training](http://www.the-train-station.co.uk)**
>
> Change your life with our Pilates Reformer, Personal Training, Ante & Post Natel, LIIT & HIIT, Kettlebell & Boxing workouts, and Post Rehabilitation motivation.

Cheers Jon

---

<div class="post-metadata">

**Author:** ![teefers](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/teefers/32/8173_2.png) [@teefers](https://forums.realmacsoftware.com/u/teefers)\
**Post date:** [April 12, 2019, 1:27pm UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/4 "2019-04-12T13:27:37Z")

</div>

> [@Jonline](#):
>
> I’ve a one page site

This might seem like a dumb question but why’d you put a navigation bar stack on a single page site?  
I’m on an iPad right now so I can’t help with the code you’re asking about.

You also should checkout how the site looks on an iPad in portrait view down starting around the “ Train together” section it becomes unreadable.

 ![IMG_0013](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/2X/8/8764287b503a77115b74cf216aa424832b0d6ee3.jpeg)

---

<div class="post-metadata">

**Author:** ![Jonline](https://avatars.discourse-cdn.com/v4/letter/j/9d8465/32.png) [@Jonline](https://forums.realmacsoftware.com/u/Jonline)\
**Post date:** [April 12, 2019, 1:53pm UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/5 "2019-04-12T13:53:25Z")

</div>

\_This might seem like a dumb question but why’d you put a navigation bar stack on a single page site?

Because I‘d left it in after lifting the top section from another site I was playing around with, so the only dumb bit is me! - Still learning, after coming off themes.  
Obviously thats now ok. 😶

I did check the site on all devices in RW8 - but think anything above a mobile would be viewed in landscape and for the life of me I couldn’t get that to format correctly in portrait as you’re pointed out. More than happy to be informed of the correct way of going about it. Thanks for your time Doug.

---

<div class="post-metadata">

**Author:** ![teefers](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/teefers/32/8173_2.png) [@teefers](https://forums.realmacsoftware.com/u/teefers)\
**Post date:** [April 12, 2019, 6:17pm UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/6 "2019-04-12T18:17:20Z")

</div>

> [@Jonline](#):
>
> but think anything above a mobile would be viewed in landscape and for the life of me I couldn’t get that to format correctly in portrait

My first suggestion would be to not think in landscape or portrait or mobile vs tablet vs desktop. You should be thinking about screen widths and making sure your site displays properly at any width. If I look at the page on a desktop and have my browser open with a window size less than 992px and greater than 767px the page is broken. That’s not an uncommon window size for desktop users with large monitors having multiple apps open at the same time.  
It’s also always a good practice to test your layouts on every possible screen width you can, and take off the “Apple blinders”, There are a lot more devices and screen widths out there than the current Apple line up. Within RapidWeaver, the Simulator only has the Apple preset devices sizes, but there is a “custom” option that allows you to “drag” to any size you like. I would suggest you do just that, start with the largest size you can and drag down slowly and watch what happens to your site as you cross each breakpoint.

Now for the problem with the current page starting at the section:

### What areas do you cover?

at the subsection `Individual Personal Training`  
You have a Foundation Row stack with one Column within the Row. That single column is set with the following classes:

```auto
col-xs-12 col-md-6 col-lg-12

```

So Im not sure why you have a different number set for the “md” (Medium) breakpoint. Right now if I edit that and change that to a `col-md-12` It flows out and fills the space. Than if that’s what we are doing than I don’t know why you would have the “row and Column at all”? But atleast change then as to not srink at the `med` size.

Now the section:

#### Train together

You have an "outter Row/column that has the class set to `col-xs-12 col-md-6 col-lg-12` like above. That outer Column/ros includes the heading and line, then the content(unordered list) bellow has another Row/column combo that has the column again set with different breakpoints `col-xs-12 col-md-6 col-lg-10`. Not sure what the reason is for the row/column inside a row/column with the different breakpoint. But again if you change the HTML on both the content flows nicely on all screen sizes.

---

<div class="post-metadata">

**Author:** ![Jonline](https://avatars.discourse-cdn.com/v4/letter/j/9d8465/32.png) [@Jonline](https://forums.realmacsoftware.com/u/Jonline)\
**Post date:** [April 13, 2019, 9:15am UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/7 "2019-04-13T09:15:38Z")

</div>

Hi Doug… many, many thanks for taking the time to explain all this, Im very grateful. I’m slowly getting my head around all this, but at times its a lot to take in. As a graphic designer Im use to making things fit to a certain size and shape, and therefore do have issues trying to get my head around responsive/flowing graphics. (more so at my age) 😁 i can use PS and illustrator etc with my eyes closed, so hopefully in time, working with RW will become 2nd nature.

I had taken for granted that once I‘d fitted to all the sizes in RW (or so I thought), that anything in between (none apple) would be catered for. 🙄  
Newbie error! (again!)

I‘ve managed to get the lower part working thanks, but will need more time on the top section. For the meantime I’ve been able to load up the Turner stack to cover that 767 - 992. Cheers Jon

---

<div class="post-metadata">

**Author:** ![teefers](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/teefers/32/8173_2.png) [@teefers](https://forums.realmacsoftware.com/u/teefers)\
**Post date:** [April 13, 2019, 1:50pm UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/8 "2019-04-13T13:50:39Z")

</div>

It’s easier when designing for use _progressive enhancement_ (aka mobile first) in the design. Start with the smallest screen width and then work your way up to the next width. Decide what you can add or change with the additional “real estate” as screen width gets larger.

As for images and responsive design, it can be challenging but doable. Everything needs to be based on the width of the screen. Images can be responsive but based on width.

I just checked your site again and saw you added a “warning message about being in landscape mode”. If I were a prospective customer that’s an instant _back button_ and onto the next site offering these services. It’s creating a poor user experience. You’ll lose prospective clients “telling them how to browse” your site.

There are people who prefer to use portrait mode and there are folks on desktops[(still the majority in most markets](http://gs.statcounter.com/platform-market-share/desktop-mobile-tablet/united-kingdom)) that can have the window sized to anything.  
This is what I get on chrome with a narrow window open:

 ![2019-04-13_06-24-30](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/2X/7/787192ad2fcee475803ca4122ee920a10160cb2a.jpeg)

I can’t easily rotate my 27-inch display and if I did and left the window size the same it won’t work anyway. Right now a user has two chooses, resize my window on my desktop (the message doesn’t tell me that) or try to force your site to work or move on to another competing site. The second option is more likely.

I would **never** tell a user how to view my site. At this point, your “lucky” that a prospective customer has come to the site, so don’t do anything that might drive them away.

---

<div class="post-metadata">

**Author:** ![Jonline](https://avatars.discourse-cdn.com/v4/letter/j/9d8465/32.png) [@Jonline](https://forums.realmacsoftware.com/u/Jonline)\
**Post date:** [April 13, 2019, 5:28pm UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/9 "2019-04-13T17:28:13Z")

</div>

Thanks for the tip re starting with the mobile and working up. As mentioned for the ‘meantime’ I’ve loaded the Turner stack as I’m away this weekend. This is only a temp fix, until I’m back on Monday, I couldn’t agree more, that this is not the way forward. However the client is fine with it for this weekend. Thanks again for your help.

---

<div class="post-metadata">

**Author:** ![system](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/system/32/25301_2.png) [@system](https://forums.realmacsoftware.com/u/system)\
**Post date:** [May 14, 2019, 3:28am UTC](https://forums.realmacsoftware.com/t/hide-the-3-bar-menu-on-a-mobile-in-foundry/26265/10 "2019-05-14T03:28:20Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
