css - Bootstrap 3 CenterNav 在页面中间

Question

<div class="other center_2">
    <div class="container_2">
    <nav id="sidebar-wrapper">
        <ul class="sidebar-nav">
            <a id="menu-close" href="#" class="btn btn-light btn-lg pull-right toggle"><i class="fa fa-times"></i></a>
            <li class="sidebar-brand">

            </li>

            <li>
                <a href="#work" onclick = $("#menu-close").click(); >Work</a>
            </li>
            <li>
                <a href="#contact" onclick = $("#menu-close").click(); >Contact</a>
            </li>

        </ul>
    </nav>
    </div>
</div>


.centered_2 {
  position: fixed; /* or absolute */
  top: 50%;
  left: 50%;
}

http://shearelegancechicago.com/todd/

当它打开时，我正在尝试将导航右轻拍居中居中。我尝试了一些不同的教程，但没有任何效果。实时链接包括。

Answer 1

在 CSS 中你有 .centered_2 类——在 HTML 中你有 center_2。只需在 CSS 中更改为 center_2，一切都会正常工作!

.center_2 {
  position: fixed; /* or absolute */
  top: 50%;
  left: 50%;
}

<div class="other center_2">
    <div class="container_2">
    <nav id="sidebar-wrapper">
        <ul class="sidebar-nav">
            <a id="menu-close" href="#" class="btn btn-light btn-lg pull-right toggle"><i class="fa fa-times"></i></a>
            <li class="sidebar-brand">

            </li>

            <li>
                <a href="#work" onclick = $("#menu-close").click(); >Work</a>
            </li>
            <li>
                <a href="#contact" onclick = $("#menu-close").click(); >Contact</a>
            </li>

        </ul>
    </nav>
    </div>
</div>

这是一个demo .