防止水平滚动条出现在溢出Div [英] Prevent Horizontal Scrollbar from Appearing in Overflowing Div

问题描述

我想防止滚动条出现时， .boxB 溢出，我不确定为什么我的代码不工作。换句话说，我试图删除水平滚动条，只有当浏览器的宽度小于boxB的宽​​度。这样，滚动条只会在浏览器宽度小于 .boxA 时出现。

I am trying to prevent the scroll bar from appearing when the div .boxB overflows and I am unsure why my code is not working. In other words, I am trying to remove the horizontal scroll bar only when the browser width is less then the width of boxB. This way, the scroll bar will only appear when the browser width is less then .boxA.

http://imgur.com/yQDFG

浅蓝色代表屏幕。黄色是一个背景div，aqua是前景div，其宽度超过屏幕宽度。在这种情况下，我不想显示滚动条。我使用了 overflow-x：hidden 但是没有做到。

The light blue represents the screen. The yellow is a background div, and the aqua is the foreground div where its width exceeds the screen width. In this case, I do not want the scroll bar to appear. I have used overflow-x:hidden but that did not do the trick.

HTML：

<div class="boxA">boxA  
  <div class="boxB">boxB</div>
</div>

CSS：

.boxA {
    background: yellow;
    width: 800px;
    height: 600px;
}

.boxB {
    background: aqua;
    width: 1000px;
    height: 400px;
        overflow-x: hidden;
}

推荐答案

$ c> overflow-x：hidden; 必须是.boxA的用途？

May be, overflow-x: hidden; must be uses for .boxA?

这篇关于防止水平滚动条出现在溢出Div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！