使用css在Firefox中显示滚动条

时间:2014-07-18 21:23:38

标签: css

我经过长时间的努力搜寻,却发现没有任何帮助。哪里错了?我真的不知道该怎么办。我在下面写了所有细节。我尝试过但没有成功。

为什么Firefox中不显示滚动条?为什么在Chrome中显示滚动条,但Firefox不显示。我写错了什么代码?

css代码:

.min1170px {
    width: 1170px;
    -moz-min-width: 1170px;
    -ms-min-width: 1170px;
    -o-min-width: 1170px;
    -webkit-min-width: 1170px;
    min-width: 1170px;
    overflow: scroll;
    overflow-x: scroll;
}
.adminBackground {
    background-color: #000000;
    background-image: url('/Images/siteBackground.jpg');
    background-repeat: repeat-x;
}

html代码:

<body class="container adminBackground min1170px">
    <nav class="navbar navbar-inverse" role="navigation">
        <div class="navbar-header">
            <a class="navbar-brand" href="#">Main</a>
        </div>
        <div id="navbarMenu">
            <ul class="nav navbar-nav">
                <li><a href="#">News</a></li>
                <li><a href="#">Apk</a></li>
                <li><a href="#">Verison</a></li>
                <li><a href="#">Setting</a></li>
                @*<li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                            Java <b class="caret"></b>
                        </a>
                        <ul class="dropdown-menu">
                            <li><a href="#">jmeter</a></li>
                            <li><a href="#">EJB</a></li>
                            <li><a href="#">Jasper Report</a></li>
                            <li class="divider"></li>
                            <li><a href="#">Separated link</a></li>
                            <li class="divider"></li>
                            <li><a href="#">One more separated link</a></li>
                        </ul>
                    </li>*@
            </ul>
            <ul class="nav navbar-nav navbar-left">
                <li><a href="#">Welcome @User.Identity.Name</a></li>
            </ul>
        </div>
    </nav>
    <div id="body">
        @RenderSection("featured", required: false)
        <section>
            @RenderBody()
        </section>
    </div>
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryBo")
    @Scripts.Render("~/bundles/hidePropaganda")

    @RenderSection("scripts", required: false)

</body>

导致firefox和chrome:

enter image description here

更新:

jsfiddle

1 个答案:

答案 0 :(得分:2)

不要在体内使用类min1170px,而是添加这样的div:

<body class="container adminBackground ">
    <div class='min1170px'>
        <nav class="navbar navbar-inverse" role="navigation">
         ....
        </nav>
    </div>
</body>
相关问题