CSS - 去除垂直滚动条

Question

以下是带有左右额外图像的菜单行代码。我需要这样的行为：当屏幕宽度从960px到1398px时，左右div同时隐藏。这段代码确实做到了我想要的！问题在于在低屏幕宽度(960px到1398px)上，它会向浏览器添加水平滚动条:(但是根据我的想法，只需要在屏幕宽度小于960px时才需要垂直滚动。有什么建议可以解决这个问题吗？谢谢。

html:

<div class="bxt">
            <div class="boxone"></div> 
            <div class="center"></div> 
            <div class="boxtwo"></div> 
</div>

CSS：

.bxt{
    width:960px;
    height:72px;
    margin:0 auto;
    position:relative;
    /*background-color:#000 */
}
.bxt div{
    position:absolute;
    width:219px;
    /* background:#CCCCCC; */
    top:0;
    height:72px;
    margin:0 0 0 0;
}
.bxt div.boxone{
    left:-219px;
        margin:0 0 0 0;
    background-image:url(images/i_02.jpg)
}
.bxt div.boxtwo{
    right:-219px;
        margin:0 0 0 0;
    background-image:url(images/i_04.jpg)
}
.bxt div.center{
    width:960px;
    height:72px;
    right:0;
    /* background:#AAAAAA; */
    background-image:url(images/i_03.jpg);
}

- abrahab

Answer 1

你可以使用 媒体查询：

body{
    overflow-y:hidden;
}
@media only screen and (max-width:960px){
    body{
        overflow-y:scroll;
    }
}

当浏览器窗口宽度小于 960px 时，将隐藏滚动条。

- Charlie

Answer 2

body{
overflow-y:hidden;
}

像这样吗？

- vincent kleine

---

似乎在低分辨率屏幕上，如800像素，垂直滚动将是不可能的？这很糟糕...我需要为小于960像素的显示器提供垂直滚动。 - abrahab