基礎和滾動窗格100％問題

我有一個部分，它是相等的列全寬。如果你看第二列，它說這裏的內容，如果我在jscroll-pane上做100％，它顯示水平條，如果我給它98％，它工作正常，但不是列的全部寬度。不知道爲什麼它將橫條添加到100％而不是98％。我不知道，如果地基引起我的問題或沒有，但如果我把它出列，並把連續的100％工作正常只是沒有在大6基礎和滾動窗格100％問題

HTML

<section id="component"> 
    <div class="row expanded collapse"> 
     <div class="large-6 column"> 
     <img src="images/image.png">  
     </div> 
     <div class="large-6 column"> 
     <div class="jscroll-pane">  
     Content Here 

     </div>  
     </div>  
     </div> 
</section>

CSS

.jscroll-pane { 
    display: block; 
    width: 100% !important; 
    height: 400px; 
    max-height: 400px; 
    overflow: auto; 
    background-color: #fff; 
} 


#component { 
    padding: 0px; 
    background-color: #fff; 
}

jscroll外部CSS文件

.jspContainer{ 
    overflow:hidden; 
    position:relative; 
    height:100% !important; 
    width: 100% !important; 
} 

.jspPane{ 
    position:absolute; 
    width: 100%!important; 
} 

.jspVerticalBar 
{ 
    position: absolute; 
    top: 0; 
    right: 0; 
    width: 16px; 
    height: 100%; 
    background: red; 
} 

.jspHorizontalBar 
{ 
    position: absolute; 
    bottom: 0; 
    left: 0; 
    width: 100%; 
    height: 16px; 
    background: red; 
} 

.jspCap 
{ 
    display: none; 
} 

.jspHorizontalBar .jspCap 
{ 
    float: left; 
} 

.jspTrack 
{ 
    background: #d8d8d8; 
    position: relative; 
} 

.jspDrag 
{ 
    background: #000; 
    position: relative; 
    top: 0; 
    left: 0; 
    cursor: pointer; 
} 

.jspHorizontalBar .jspTrack, 
.jspHorizontalBar .jspDrag 
{ 
    float: left; 
    height: 100%; 
} 

.jspArrow 
{ 
    background: #50506d; 
    text-indent: -20000px; 
    display: block; 
    cursor: pointer; 
    padding: 0; 
    margin: 0; 
} 

.jspArrow.jspDisabled 
{ 
    cursor: default; 
    background: #80808d; 
} 

.jspVerticalBar .jspArrow 
{ 
    height: 16px; 
} 

.jspHorizontalBar .jspArrow 
{ 
    width: 16px; 
    float: left; 
    height: 100%; 
} 

.jspVerticalBar .jspArrow:focus 
{ 
    outline: none; 
} 

.jspCorner 
{ 
    background: #eeeef4; 
    float: left; 
    height: 100%; 
} 

/* Yuk! CSS Hack for IE6 3 pixel bug :(*/ 
* html .jspCorner 
{ 
    margin: 0 -3px 0 0; 
}

來源

2016-11-16 Case

嘗試此，刪除顯示塊和變化溢出：汽車到隱藏;我相信這應該對你有所幫助。

.jscroll-pane { 
    width: 100% !important; 
    height: 400px; 
    max-height: 400px; 
    overflow: hidden; 
    background-color: #fff; 
}

來源

2016-11-21 01:23:18 Codi

基礎和滾動窗格100％問題

回答

相關問題