css

overflowの横スクロールバーを出さないようにするポイント

MacIEでNG

<div style="height:150px;width:130px;">
		<div style="height:150px;overflow:auto;">
				<h1>タイトル部分</h1>
				<p>本文部分…</p>
		</div>
</div>

MacIEでOK

<div style="height:150px;width:130px;">
		<div style="height:150px;overflow:auto;">
				<div>
				<h1>タイトル部分</h1>
				<p>本文部分…</p>
				</div>
		</div>
</div>

• ポイントは、overflowしたボックスの中身が、一つのブロック要素でまとまっているかどうか。

• ちなみにこれはMacIEでOK

<div style="height:150px;width:130px;">
		<div style="height:150px;overflow:auto;">
				<ul>
				<li>箇条書き…</li>
				<li>箇条書き…</li>
				</ul>
		</div>
</div>

• ちなみにこれはMacIEでNG…な時もある。

<div style="height:150px;width:130px;">
		<div style="height:150px;overflow:auto;">
				<ul>
				<li>
				<h1>タイトル部分</h1>
				<p>本文部分…</p>
				</li>
				</ul>
		</div>
</div>