CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
agis
agis

Reputation: 1841

Twitter bootstrap - navigation bar absolute positioning

I'm using the latest version of Twitter Bootstrap and I want to absolutely position the navigation bar on top of the page.

Here's how the code looks like : 

<div class="navbar navbar-transparent navbar-static-top" role="navigation">
  ......
<section id="slider">
... here is the markup for a slider...

If I use navbar-static-top it will not position on top of the slider section and I have to add a negative top margin for the slider section in order to make the navigation bar to stay on top of the slider section like this: 

#slider { 
position:relative;
top:-90px;
}

Here's also a jsbin to see exactly what I'm talking about; Is there a more correct, semantic way to do this ? I don't want to use fixed positioning.

Upvotes: 0

Views: 378

Answers (1)

Sebsemillia
Sebsemillia

Reputation: 9476

If I understand you correct, you want the navbar to be displayed above the slider. Am I correct?

If so, why not simply give the .navbar position:absolute;? If there are any overlaying issues, you can use z-index to control them.

Here is a working example.

Upvotes: 1

Related Questions