Question：ボックスに縦スクロールバーを表示するには？

ボックスに縦スクロールバーを表示する方法です。

限定された面積のボックス内に文字などが収まらない場合、
縦スクロールバーを自動で表示します。

例：HTML

<div class="box-scroll">
    <p>文字など・・・・・・</p>
</div>

例：CSS

.box-scroll {
    height: 7em;    
    overflow: auto;  
    padding:10px;
    border: solid 1px #747474; 
    background-color:#FBF2C3; 
    }

デモページはこちら

cssの「overflow: auto」で縦スクロールバーを自動表示させます。
「height」で高さを規定します。

ちなみに「overflow: scroll」にすると、縦と横のスクロールバーが自動表示されます。

また、ボックス内に文字等がキッチリ収まる場合は、スクロールバーは表示されません。

＊参考サイト

制作のご依頼を受け付けています

星月WEBデザインでは
ホームページ（WEBサイト）・バナー画像等の制作依頼を受け付けています。

クラウドソーシングのランサーズからお申し込みください。

ランサーズ：星月WEBデザインのページはこちら

メールでのお問い合わせはこちら