반응 형 테이블 내의 부트 스트랩 드롭 다운 메뉴

부트 스트랩 3의 응답 가능 테이블 내의 드롭 다운 메뉴에 문제가 있습니다. 오버플로 : 자동 또는 위치 지정과 같은 CSS 배치에 관계없이 메뉴가 드롭 다운에 나타납니다. 반응 형 div를 클릭하고 링크를 클릭하려면 스크롤해야합니다.반응 형 테이블 내의 부트 스트랩 드롭 다운 메뉴

enter image description here

<div class="table-responsive"> 
      <table class="table table-striped"> 
       <thead> 
       <tr class="table_desc"> 
        <th></th> 
        <th><input type="checkbox"></th> 
        <th>Status</th> 
        <th>Action</th> 
       </tr> 
       </thead> 
       <tbody> 
       <tr class="table_items"> 
        <td><div class="item_strip"></div></td> 
        <th><input type="checkbox"></th> 
        <td>Deposit Paid</td> 
        <td> 
        <!-- Split button --> 
        <div class="btn-group action-button"> 
         <button type="button" class="btn btn-xs btn-danger">View</button> 
         <button type="button" class="btn btn-danger btn-xs dropdown-toggle" data-toggle="dropdown" aria-expanded="false"> 
         <span class="caret"></span> 
         <span class="sr-only">Toggle Dropdown</span> 
         </button> 
         <ul class="dropdown-menu" role="menu"> 
         <li><a href="#">Edit</a></li> 
         <!-- <li class="divider"></li> --> 
         <li><a href="#">Send Invoice</a></li> 
         <li><a href="#">Send Reminder</a></li> 
         </ul> 
        </div> 
        </td> 
       </tr> 
       </tbody> 
      </table> 
</div>

어떤 아이디어?

출처

2014-11-22 lancey

나는 다른 게시물에 그 대답 : [내 대답보기] (http://stackoverflow.com/questions/26018756/bootstrap-button-drop-down-inside-responsive-table-not-visible- because-of-scroll # 34211851) – BaltazarQc

@BaltazarQc overflow-y : auto를 설정하여 반응 형 테이블에 세로 스크롤 막대가 필요한 경우 솔루션이 작동하지 않습니다. – ImTalkingCode

라인에 bootstrap.css에서 디버깅 후 2247

@media screen and (max-width: 767px) { 
.table-responsive { 
    width: 100%; 
    margin-bottom: 15px; 
    overflow-x: auto; 
    overflow-y: hidden; 
    -webkit-overflow-scrolling: touch; 
    -ms-overflow-style: -ms-autohiding-scrollbar; 
    border: 1px solid #ddd; 
    }

당신은 모두가 당신이 단순히 사람들을 덮어 쓸 경우 properly.It 때문에 오버 플로우 특성의 폭 767 이하 제대로 작동하지 않습니다 작동 오버 플로우 언급 경우 그것은 작동합니다.

출처

2014-11-22 19:43:47 Bhagya

반응 형 테이블 내의 부트 스트랩 드롭 다운 메뉴

답변

관련 문제