概要
CSS flex-grow プロパティは、flex アイテムの flex grow factor を指定します。
- 初期値error:(<s*codes+ids*=s*"initial-flex-grow"[^>]*>)</s*codes+ids*=s*"initial-flex-grow"[^>
- 適用対象 flex アイテム
- 継承 なし
- メディア
visual - 計算値 指定値
他のプロパティや詳細情報については CSS flexible box の利用 をご覧ください。
構文
形式構文: <number>
flex-grow: 3 flex-grow: inherit
値
-
<number> -
<数量>をご覧ください。負の値は不正です。
例
element {
flex-grow: 3;
}
仕様書
| 仕様書 | 状況 | 備考 |
|---|---|---|
| CSS Flexible Box Layout Module | 勧告候補 |
ブラウザ実装状況
| 機能 | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| 基本サポート | 18.0 (18.0) (要設定) [1] 20.0 (20.0) |
21.0-webkit | 未サポート | 12.10 | 未サポート |
| 機能 | Firefox Mobile (Gecko) | Android | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| 基本サポート | ? | ? | 未サポート | 12.10 | 未サポート |
[1] Firefox は単一ラインの flexbox のみサポートしています。flexbox サポートを有効にするには、Firefox 18 および 19 ではユーザが about:config の設定 "layout.css.flexbox.enabled" を true に変更することが必要です。
関連情報
- CSS flexible box の利用
- flex 関連 CSS プロパティ:
margin、align-content、align-items、align-self、display、flex、flex-basis、flex-direction、flex-flow、flex-grow、flex-shrink、flex-wrap、justify-content、min-height、min-width、order