bootstrap 3 - обратная навигация по выравниванию

Как заставить nav-justified действовать в обратном порядке? Я имею в виду, что я хочу, чтобы на маленьких (мобильных) экранах вкладки/таблетки располагались горизонтально, а на больших (настольных) экранах располагались вертикально, т. е. располагались друг над другом.
Вот пример, для которого правила CSS должны быть изменить (изменить размер окна, чтобы увидеть, как оно будет выглядеть на обоих типах экранов): http://s.bootply.com/render/1d0Cpp0po1
Кто-нибудь знает, как добиться этого самым простым способом? Заранее спасибо!


css twitter-bootstrap twitter-bootstrap-3 bootstrap-tabs
person softzer0    schedule 06.05.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Решил это с помощью этого CSS:

.nav-justified-inverse > li {
    float: none;
}

@media (max-width: 768px) {
    .nav-justified-inverse > li {
        display: table-cell;
        width: 1%;
    }
}

Демонстрация: http://s.bootply.com/render/AtQH4rry48

person softzer0    schedule 06.05.2016