はみ出し部分の表示方法 overflow

はみ出した部分をどう表示するかを指定します。

width:100px; height:100px; overflow:●●;

を指定した時の表示は次の通りです。

overflow : visible ;

ボックスからはみ出して表示されます。

が、ブラウザーによって表示がことなります。

ＩＥの場合

ボックスが文字に合わせます。

ＮＮの場合

はみ出ます。

Ｏｐｅｒａの場合

はみ出ます。

あなたのブラウザーではどうでしょうか？

あなたの場合

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをん

ＡＢＣＤＥＦＧＨＩＪＫＬＭＮＯＰＱＲＳＴＵＶＷＸＹＺ

はみ出てますか？

overflow : scroll ;

入りきらないとスクロールします。

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをん

ＡＢＣＤＥＦＧＨＩＪＫＬＭＮＯＰＱＲＳＴＵＶＷＸＹＺ

入りきってもスクロールバーは出ます。

あいうえお

overflow : hidden ;

はみ出た部分は表示されません。

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをん

ＡＢＣＤＥＦＧＨＩＪＫＬＭＮＯＰＱＲＳＴＵＶＷＸＹＺ

overflow : auto ;

はみ出た部分はブラウザーに自動的に合わせます。

大体スクロールします。

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをん

ＡＢＣＤＥＦＧＨＩＪＫＬＭＮＯＰＱＲＳＴＵＶＷＸＹＺ