CODEWITHSUNDEEP
cssruby-on-railszurb-foundation
fatfrog
fatfrog

Reputation: 2160

Zurb Foundation menu - Separate Align for desktop and mobile views

For my Zurb menu, I want it to be aligned center in desktop view - to do this I used the following code:

nav.top-bar {
text-align:center;
}
section.top-bar-section {
display: inline-block;
}

The problem is, it also centres the menu in mobile mode. I would like the mobile mode to stay aligned to the left. Is this possible? Thanks!

Upvotes: 1

Views: 73

Answers (1)

Mandeep
Mandeep

Reputation: 9173

You need to use css media queries. You can do something like this:

@media only screen and (max-width : 320px) {
  nav.top-bar {
    text-align:left;
  }
}

Make sure you add this style below your original style so that it can override it. Checkout some media queries for standard devices

Upvotes: 1

Related Questions