CODEWITHSUNDEEP
zurb-foundation
user2447453
user2447453

Reputation: 1

How to hide foundation top bar for large (desktop)?

I am new to foundation. I have a top bar and I want to hide it for desktop because I have another menu for it.

I try to use hide-for-large class, but it didn't work for me. How can I resolve this?

Upvotes: 0

Views: 252

Answers (3)

user3257693
user3257693

Reputation: 486

With Foundation if your hide-for-large class isn't working, it could be that you are selectively include components and have not included the visibility classes in your app.scss file @import "foundation/components/visibility"; , you need this for that class to work.

Upvotes: 0

Fellow Stranger
Fellow Stranger

Reputation: 34013

Try to use .hide-for-medium-up

Upvotes: 2

Gavin Bruce
Gavin Bruce

Reputation: 1809

The class .topbar uses !important on the display property. To override this behaviour, add the following to the bottom of your app.css file or app.scss file. Since its on the bottom of the file, it is given priority. 

@media only screen and (min-width: 1440px) {
  .topbar {
    display:none !important;
  }
}

Upvotes: 0

Related Questions