Я видел этот пост, но, будучи новым пользователем, я не могу комментировать, чтобы попросить разъяснения.
Я использую оправданные вкладки nav в Bootstrap и не хочу, чтобы они складывались на небольших экранах, так как у меня есть только две вкладки. Я бы хотел, чтобы они оставались бок о бок, просто сжимались, чтобы соответствовать экрану. Это то, что у меня есть:
<!-- Nav tabs -->
<ul class="nav nav-tabs nav-justified" id="myTab">
<li class="active"><a href="#ratings" data-toggle="tab">Ratings</a></li>
<li><a href="#reviews" data-toggle="tab">Reviews</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div class="tab-pane active" id="ratings">This is a rating section</div>
<div class="tab-pane" id="reviews">This is for reviews. There should be some styling here.</div>
</div>
Поскольку связанная статья предлагает использовать медиа-запросы, я, похоже, не могу сделать эту работу. Я попробовал настроить следующие параметры для таргетинга только небольших экранов:
@media (max-width: 768px) {
.nav-justified > li {display: table-cell;}
}
Я не уверен, что я делаю неправильно, поэтому любая помощь очень ценится.