CSS:
.col-fixed-left {
/* Fixed Width */
width: 250px;
/* Fixed Sidebar */
position: fixed;
height: 100%;
padding: 0px 15px;
background: #444c63;
}
.col-fluid-right {
width: 100%;
padding: 0px 15px;
background: #ffffff;
}
的HTML:
<div class="col-fixed-left">
<a href="#">Left Side</a>
</div>
<div class="col-fluid-right">
<a href="#">Right Side</a>
</div>
问题:问题是,右侧固定在div中,因此右侧进入了左侧div。我不想应用margin-left:250px(因为左div为250px宽)以在屏幕上正确显示右div文本。我需要一个好的解决方案。
jsfiddle
最佳答案
.col-fixed-left {
/* Fixed Width */
width: 250px;
/* Fixed Sidebar */
position: fixed;
height: 100%;
padding: 0px 15px;
background: #444c63;
}
.col-fluid-right {
width: 250px;
padding: 0px 15px;
background: #ddd;
position: fixed;
left:250px;
height: 100%;
}
<div class="col-fixed-left">
<a href="#">Left Side</a>
</div>
<div class="col-fluid-right">
<a href="#">Right Side</a>
</div>
http://jsfiddle.net/bt1h68bv/2/
试试这个解决方案。
关于html - 左div:固定:右div流体-次要问题CSS,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/31349369/