2014-11-22 188 views
2

林其在引导3响应性表内的下拉菜单的问题不管是什么,我把在CSS(如溢出:自动或定位)在下拉菜单中出现的响应div和为了点击任何你将不得不滚动的链接。引导下拉菜单

enter image description here

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> 

什么想法?

+0

我在其他帖子回答: [查看我的答案](http://stackoverflow.com/questions/26018756/bootstrap-button-drop-down-inside-responsive-table-not-visible-因为滚动#34211851) – BaltazarQc 2015-12-10 21:18:00

+0

@BaltazarQc如果您还想在响应表上设置垂直滚动条,您可以通过设置overflow-y:auto来解决您的问题。 – ImTalkingCode 2017-05-04 05:12:59

回答

1

上线调试中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宽度的正常工作,因为溢出性的,如果你只是在覆盖这些你它将工作。