Create Responsive Tabs using Bootstrap (They should get stacked automatically on smaller screens)

Question

How can I create responsive tabs which get stacked automatically using bootstrap. The code for my navs is -

<div>
    <ul id="tabslist_navs" class="nav nav-tabs">
        <li><a href="#">Normal</a></li>
        <li><a href="#">Hover</a></li>
        <li><a href="#">Selected</a></li>
    </ul>
    <div class="tab-content">
        ....
    </div>
</div>

I need them to get converted to stacked tabs when viewed on small screens. Right now it just moves the tabs into multiple likes which looks ugly. I want something like the navbar collapse but without the button to activate the collapse.

Answer 1

This should work:

@media (max-width: 480px) { 
    .nav-tabs > li {
        float:none;
    }
}