首页 > 解决方案 > 标题和侧边栏之间出现间隙

问题描述

我们面临页眉和侧边栏的问题,因为当我们在桌面中打开应用程序时,页眉和侧边栏之间会显示一个间隙(如图所示)。

标题问题

/*Side bar align top*/
.sidebar-top {
    top: 8% !important;
}
<body>
    <header class="fixed-top">
        <nav class="navbar navbar-expand-sm navbar-toggleable-sm bg-transparent">
            <div class="container-fluid">
                <ul class="nav navbar-nav">
                    <li class="active pl-3">
                    </li>
                </ul>
                <ul class="nav navbar-nav navbar-right">
                    <li class="pr-3">
                    </li>
                    <li>
                    </li>
                </ul>
            </div>
        </nav>
    </header>
    <div class="page-wrapper default-theme toggled pinned"  id="body-row">
        <nav id="sidebar" class="sidebar-wrapper position-fixed sidebar-top">
            <div class="sidebar-content desktop">
                <div class=" sidebar-item sidebar-menu">
                    <ul>
                        <li class="sidebar-dropdown">
                            <div class="sidebar-submenu">
                            </div>
                        </li>
                    </ul>
                </div>
                <!-- sidebar-menu  -->
            </div>
            <!-- sidebar-footer  -->
        </nav>
        <div class="page-content pt-2 bg-light mt-5" >
            <div id="overlay" class="overlay"></div>
            <div class="container-fluid p-2">
                @RenderBody()
            </div>
        </div>
    </div>

    <footer class="border-top footer text-muted">
        <div class="container">
            &copy; 2019
        </div>
    </footer>
    </body>

谁能建议我如何解决这个问题?

标签: twitter-bootstrap

解决方案


推荐阅读