我正在使用 Bootstrap 并试图将一个 div 修复到 body-container
div 的顶部。
使用此 css,我能够将 div 固定到容器的顶部,但它溢出了 body-container
div 的右侧:
.top-bar {
position: fixed;
z-index: 1030;
top: 60px;
width: 100%;
}
.top-bar .item-count h4{
text-align: center;
}
这是我所有的 html/css:https://jsfiddle.net/rttvqa3k/
最佳答案
检查它是否有帮助.. :)
旧:
<div class="top-bar panel panel-default">
<div class="panel-body row">
<div class="col-xs-4 col-sm-4 col-md-4">
<button class="btn btn-default">Button 1</button>
<button class="btn btn-default">Button 2</button>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 matter-count">
<h4>### Items in Report</h4>
</div>
<div class="col-xs-4 col-sm-4 col-md-4">
<button class="btn btn-default pull-right">Button 3</button>
</div>
</div>
</div>
新:
<div class="navbar-fixed-top container" style="top:60px;">
<div class="panel panel-default">
<div class="panel-body row">
<div class="col-xs-4 col-sm-4 col-md-4">
<button class="btn btn-default">Button 1</button>
<button class="btn btn-default">Button 2</button>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 matter-count">
<h4>### Items in Report</h4>
</div>
<div class="col-xs-4 col-sm-4 col-md-4">
<button class="btn btn-default pull-right">Button 3</button>
</div>
</div>
</div>
</div>
关于css - 修复了 body-content 宽度为 100% 的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39129580/