Forcing Bootstrap list to be vertical

[rennanzera]

Hey Guys!

I’m using bootstrap and I’m having a problem with the nav bar with media queries. How can I put it to be a vertical list?
This is the code:

• Empresa
• Projects
• Partner
• Events
• Contact

And the CSS:

@media (max-width: 499px) {
.nav li{
display: list-item;
float: left;
height: 100%;
width: 40px;
position: relative;
clear: left;
list-style: none;
}
}

I believe it’s simple, but I can’t find the solution =(

Cheers.

[rennanzera]

Anybody out there?

[Paulie_D]

Doesn’t the navbar do that automatically at mobile sizes…when the responsiveness is implemented?

http://twitter.github.io/bootstrap/components.html#navbar

>Responsive navbar

>To implement a collapsing responsive navbar, wrap your navbar content in a containing div, .nav-collapse.collapse, and add the navbar toggle button, .btn-navbar.

[rennanzera]

Yes, I know, but I want to use just a link list. Is it possible?

[Paulie_D]

>I want to use just a link list. Is it possible?

I’m not sure what you mean.

Do you mean instead of the navbar or a separate menu somewhere else.

Obviously, you can have a second menu as Bootstrap have demonstrated on their component page. They have a navbar at the top and a second vertical menu in a sidebar.

http://twitter.github.io/bootstrap/components.html

[NghiQuach]

You can just use the nav-list component of bootstrap and style it differently.

[Author]

Posts