これは実験段階の機能です。
この機能は複数のブラウザで開発中の状態にあります。各ブラウザで用いるために、適切なベンダー接頭辞が必要な場合があります。互換性テーブルをチェックしてください。また、実験段階の機能の構文と挙動は、仕様変更に伴い各ブラウザの将来のバージョンで変更になる可能性があることに注意してください。
概要
CSS の overflow-x プロパティは、ブロックレベル要素のコンテンツが左右いずれかの境界からはみ出したときに、はみ出したコンテンツをそのまま表示するのか、クリップするのか、スクロールバーをつけて表示するのかを指定します。
構文
形式文法: visible | hidden | scroll | auto
overflow-x: visible overflow-x: hidden overflow-x: scroll overflow-x: auto overflow-x: inherit
値
visible- コンテンツはクリップされず、コンテンツのボックスより外側に描画されるかもしれません。
hidden- コンテンツはクリップされ、クリップ領域外の（見えなくなった）コンテンツを見るためのスクロールバーは作られません。
scroll- コンテンツはクリップされ、デスクトップブラウザではコンテンツがクリップされたかどうかに関わらず、スクロールバーを描画します。これは、動的な環境でスクロールバーが表示されたり消されたりして起きる問題を防ぎます。プリンターははみ出たコンテンツを印刷するかもしれません。
auto- ユーザエージェントに依存する動作です。Firefox のようなデスクトップブラウザでは、コンテンツがはみ出るならスクロールバーを作ります。
例
[fixme]
仕様
| 仕様書 | 策定状況 | コメント |
|---|---|---|
| CSS Basic Box Model The definition of 'overflow-x' in that specification. |
草案 |
ブラウザ実装状況
| 機能 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| 基本サポート | 1.0 | 3.5 (1.9.1) | 5.0 [*] | 9.5 | 3.0 |
| 機能 | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| 基本サポート | 1.0 | (有) | 1.0 (1.9.1) | (有) | (有) | (有) |
[*] IE8 は -ms-overflow-x を overflow-x の同義語として導入しました。プレフィックス -ms- は使わないでください。
関連情報
overflow-x関連 CSS プロパティ:text-overflow、white-space、overflow、overflow-y、clip、display