将标题栏放在侧边栏旁边

Question

我使用bootstrap并希望在侧边栏的右侧添加一个标题栏，因此它会在旁边对齐，而不会坐在顶部。侧边栏也是可折叠的，因此一旦侧边栏折叠，标题就必须扩展到整个页面。

补充工具栏代码：

<!-- Sidebar -->
    <div id="sidebar-wrapper">
        <ul class="sidebar-nav">
            <li class="sidebar-brand">
                <a href="#">
                    Start Bootstrap
                </a>
            </li>
            <li>
                <a href="#">Dashboard</a>
            </li>
            <li>
                <a href="#">Shortcuts</a>
            </li>
            <li>
                <a href="#">Overview</a>
            </li>
            <li>
                <a href="#">Events</a>
            </li>
            <li>
                <a href="#">About</a>
            </li>
            <li>
                <a href="#">Services</a>
            </li>
            <li>
                <a href="#">Contact</a>
            </li>
        </ul>
    </div>
    <!-- /#sidebar-wrapper -->

Answer 1

看到你已经在使用bootstrap，为什么不将已经构建的列类添加到标记中。确保包含Bootstrap CSS。

<div id="sidebar-wrapper" class="col-lg-3">

然后在你的标题上......

<div id="header-wrapper" class="col-lg-9">

还做了一支笔found here

利用列类是一个好主意，因为它使响应式设计更容易。

Answer 2

使用默认导航栏将其放置在包装内，但在侧栏导航div下方，无需额外定位。