如何把DIV滾動條放在固定寬度的DIV內（overflow：auto，float：left）

Question

我有一個如下的DIV。我的問題是，每當滾動條可見時，它顯示在300px寬度外。但我需要爲DIV固定300px的寬度，而不考慮滾動條。我怎樣才能做到這一點？

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

感謝，

Answer 1

我要麼放在一個300容器div和溢出適用於內的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佔約。滾動條的寬度。