スタイルシート［CSS］/ボックス/overflowの縦横の処理を個別に指定する

overflow-*** は、overflow の縦と横を個別に指定するプロパティです。
（*** の部分には、x または y が入ります）

overflow-x … 横方向の指定
overflow-y … 縦方向の指定

このプロパティの値に scroll を指定すると、縦のスクロールと横のスクロールを個別に指定することができます。

div {
width: 200px;
height: 100px;
overflow-x: scroll;
overflow-y: scroll;
}

overflow-x（横） overflow-y（縦）	visible … （領域をはみ出して表示する）デフォルト
	hidden … （はみ出した部分を表示しない）
	scroll … （スクロールで表示する）
	auto … （自動）

このプロパティはIEの独自拡張です。そのため、IE以外のブラウザでは表示が乱れる場合があります。

使用例

<html>
<head>
<title>TAG index Webサイト</title>

<style type="text/css">

</style>

</head>
<body>

<div id="example1">
<p>縦方向のスクロール</p>
・
・
</div>

<div id="example2">
<p>横方向のスクロール</p>
・
・
</div>

</body>
</html>

▼これをブラウザで見ると次のように表示されます

縦方向のスクロール

縦のスクロール

横方向のスクロール

横のスクロール・横のスクロール・横のスクロール・横のスクロール・横のスクロール・横のスクロール

overflowの縦横の処理を個別に指定する

overflow-***: ***;

使用例

overflow-: ;