修复了 AdminLTE 中的 content-header

Question

我在 <body> 中使用 AdminLTE 和 sidebar-collapse fixed 并尝试修复 content-header。所以它会像header一样浮动。这里的 HTML 代码：

<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header row">
        <h1 class="col-md-6">
            Master Satuan
        </h1>
        <div class="col-md-6 text-right">
            <button id="batchDelete" class="btn btn-danger mx-1">
                <i class="fa fa-trash"></i> Delete
            </button>&nbsp;
            <button id="btnAdd" class="btn btn-success mx-1" href="#">
                <i class="fa fa-plus"></i> Add
            </button>
        </div>
    </section>

    <!-- Main content -->
    <section class="content">
    <!-- Content here ->
    </section>
 </div>

我试过用 position: fixed 修改 css content-header 但 header 隐藏在主要内容的后面。并尝试了固定的 header 滚动 w3c 但没有成功，因为 header 仍然隐藏在主要内容的后面。其实我只是想在 Main Header 之后有一个固定的位置。我怎样才能做到这一点？

Answer 1

为您的header设置posistion:fixed;和z-index。

并且，主要内容设置position:absolute;。设置 top: some pixel values

修复了 AdminLTE 中的 content-header

Fixed content-header in AdminLTE

html

css

twitter-bootstrap-3

adminlte