Skip to main content


This topic contains 3 replies, has 0 voices, and was last updated by  jking 6 years, 8 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #39890


    Hi, CSS newb here, apologies.

    Currently using Twitter Bootstrap. As title says, want to create a layout with two fixed nav bars stacked on top of each other

    Aim is for the ‘top’ nav bar’s color to stay constant whilst navigating, and the bottom nav bar to change color for almost every page.

    Is there an ‘easy’ way to do this?

    I’ve thought of one way to do it:

    1: Copy all the .navbar-inverse CSS code, modify it for each color, then write an IF statement within the page template to insert the applicable CSS class into:

    div class=”navbar navbar-inverse navbar-fixed-top”

    Replacing navbar-inverse with the new color class, depending on which page is being displayed.

    However this violates the DRY principle – so I’m hopeful there’s a much simpler method!



    Are you using any type of CMS?



    No, not currently.



    Depending on how large the site is going to be, I’d recommend it.

    If pages are being created statically, I’d just add a class to the body.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star