탭 스왑 질문드려요
본문
아래 코드를 사용하면
PC에서는 탭이 가로로 나열이 되는데
모바일에서는 세로로 나열이 되네요.
모바일에서도 가로로 하려면 어떻게 하면 될까요 ?
<!-- 랜덤 무한탭 메뉴 시작 -->
<div class="widget-box widget-img"> <!-- 위 아래 위젯 간격 1칸 주기위함 -->
<div id="tab" class="div-tab tabs swipe-tab">
<div class="main-tab bg-light">
<ul class="nav nav-tabs nav-justified">
<?php $tnum = rand(1, 3); //탭이 열개라면 1부터 10까지 랜덤 숫자 추출 ?>
<li<?php if($tnum == "1") echo ' class="active"';?>>
<a href="#main-tab-a1" data-toggle="tab">탭1</a></li>
<li<?php if($tnum == "2") echo ' class="active"';?>>
<a href="#main-tab-a2" data-toggle="tab">탭2</a></li>
<li<?php if($tnum == "3") echo ' class="active"';?>>
<a href="#main-tab-a3" data-toggle="tab">텝3</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane <?php if($tnum == "1") echo 'active';?>" id="main-tab-a1"style="border:1px solid #ddd; padding:11px;">
<?php echo latest("게시판종류", "게시판명", 5, 25 ); ?>
<div class="clearfix"></div>
</div>
<div class="tab-pane <?php if($tnum == "2") echo 'active';?>" id="main-tab-a2"style="border:1px solid #ddd; padding:11px;">
<?php echo latest("게시판종류", "게시판명", 5, 25 ); ?>
<div class="clearfix"></div>
</div>
<div class="tab-pane <?php if($tnum == "3") echo 'active';?>" id="main-tab-a3" style="border:1px solid #ddd; padding:11px;">
<?php echo latest("게시판종류", "게시판명", 5, 25 ); ?>
<div class="clearfix"></div>
</div>
</div>
</div></div>
<!-- 랜덤 무한탭 메뉴 끝 -->