Question

我有一个容器div，我有我的标识，右边我有我的菜单，我想要做的是，当导航栏达到屏幕尺寸移动时我希望每个

是在一行，每行是容器流体的大小，目前问题是每个li大小与我的容器相同，我怎么能改变它？

这是我的代码：

    <div id="navigation_bar">
        <div class="content">
            <div id="logo">
                <a href="index.html">
                    <img class="logo_dark" src="images/virtuai/logo-dark.png" alt="Enar Logo">
                    <img class="logo_light" src="images/logo-light.png" alt="Enar Logo">
                </a>
            </div>
            <nav id="main_nav navbar-right">
                <div id="nav_menu">
                    <span class="mobile_menu_trigger">
                            <a href="#" class="nav_trigger"><span></span></a>
                    </span>
                    <ul id="navy" class="clearfix" style="float:right">
                        <li class="normal_menu mobile_menu_toggle current_page_item">
                            <a href="index.html"><span>HOME</span></a>
                        </li>
                        <li class="normal_menu mobile_menu_toggle current_page_item">
                            <a href="index.html"><span>ABOUT US</span></a>
                        </li>
                        <li class="normal_menu mobile_menu_toggle current_page_item">
                            <a href="index.html"><span>SOLUTIONS</span></a>
                        </li>
                        <li class="normal_menu mobile_menu_toggle current_page_item">
                            <a href="index.html"><span>CONTACT US</span></a>
                        </li>
                    </ul>
                </div>
            </nav>
            <!-- End Nav -->
            <div class="clear"></div>
        </div>

Answer 1

试试此代码.. 覆盖引导容器宽度

@media screen and (max-width: 768px) {
  body .container{
    width:100% !important;
  }
}

导航栏容器移动折叠全宽（容器流体）

1 个答案: