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 -

Answer 1

    @media (max-width: 480px) {
        .nav-tabs > li {
            float:none;
            margin-bottom: 0px;
        }
        .nav-tabs > li.active > a {
            border: 1px solid #ffffdffffd;
        }
        .nav-tabs > li.active > a:hover {
            border: 1px solid #ffffdffffd;
        }
        .nav-tabs > li  > a {
            border-bottom: 1px solid #ffffdffffd;
            border-left: 1px solid #ffffdffffd;
            border-right: 1px solid #ffffdffffd;
        }
        .nav-tabs > li > a:hover {
            border-color: #ffffdffffd;
        }
    }

This one is more simple and good-looking.