私は以下のようなDIVを持っています。私の問題は、スクロールバーが表示されているときはいつでも、300px幅の外側に表示されることです。ただし、スクロールバーに関係なく、DIVには300pxの固定幅が必要です。どうやってやるの?
<div style="width:300px; overflow:auto; float:left;"></div>
ありがとう、
div を 300px コンテナーに配置し、オーバーフローを内側の div に適用します。それはあなたが望む次元にそれを制約するはずです。それが望ましくない場合は、実験して適用するかどうかを確認できますがbox-sizing:border-box
、古いバージョンの IE ではサポートされていません。
この回答で質問を正しく理解できていることを願っています。そうでない場合は、示してください。
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;
}
You could use overflow-y: scroll
so that the scrollbar will always be visible and then set the width of the div to 284px
to account for the approx. width of the scrollbar.