如何将DIV滚动条放在固定宽度DIV内（溢出：自动，浮动：左）

Question

我有一个像下面这样的DIV。我的问题是，只要滚动条可见，它就会显示在300px宽度之外。但是无论滚动条如何，我都需要为DIV修复300px的宽度。我怎么能这样做？

<div style="width:300px; overflow:auto; float:left;"></div>

谢谢，

Answer 1

我要将div放在一个300px的容器中，然后将溢出应用到内部div。这应该将它限制在你想要的尺寸。如果这不合适，您可以尝试使用它，看看是否应用box-sizing:border-box，但旧版IE不支持。

Answer 2

希望我能正确理解这个问题，如果不是，请表明。

http://jsfiddle.net/hmCFh/1/

HTML

<div>
Lorem ipsum dolor sit amet, vehicula vulputate, velit sapien suspendisse, ipsum nunc, integer velit aptent non quam. Erat sit consequat lectus, velit risus taciti, in sed, risus tincidunt. Egestas lacus vel voluptatem in volutpat. Sapien lacus suspendisse nec velit. Integer molestie erat, erat lectus luctus ipsum. Nulla massa netus. Odio nunc maecenas modi tortor cras in. Quis nonummy ridiculus vel sed, luctus nulla lectus bibendum justo donec.

Lorem ipsum dolor sit amet, vehicula vulputate, velit sapien suspendisse, ipsum nunc, integer velit aptent non quam. Erat sit consequat lectus, velit risus taciti, in sed, risus tincidunt. Egestas lacus vel voluptatem in volutpat. Sapien lacus suspendisse nec velit. Integer molestie erat, erat lectus luctus ipsum. Nulla massa netus. Odio nunc maecenas modi tortor cras in. Quis nonummy ridiculus vel sed, luctus nulla lectus bibendum justo donec.    

Lorem ipsum dolor sit amet, vehicula vulputate, velit sapien suspendisse, ipsum nunc, integer velit aptent non quam. Erat sit consequat lectus, velit risus taciti, in sed, risus tincidunt. Egestas lacus vel voluptatem in volutpat. Sapien lacus suspendisse nec velit. Integer molestie erat, erat lectus luctus ipsum. Nulla massa netus. Odio nunc maecenas modi tortor cras in. Quis nonummy ridiculus vel sed, luctus nulla lectus bibendum justo donec.        
</div>

CSS

div {
    width:300px; 
    height:300px;
    overflow-y:scroll; 
    float:left;
    background:orange;    
}

Answer 3

您可以使用overflow-y: scroll以便滚动条始终可见，然后将div的宽度设置为284px以占据约。滚动条的宽度。