CSS min-inline-size 属性

定義と用法

min-inline-size 属性指定元素在行内方向上的最小尺寸。

行内方向上の内容のサイズが最小サイズより小さい場合、 min-inline-size 属性値が適用されます。

行内方向上の内容のサイズが最小サイズを超える場合、 min-inline-size 属性値は効果がありません。

注意：関連する CSS 属性 writing-mode 行内方向を定義し、これにより min-inline-size 属性の結果です。英語ページでは、ブロック方向は下向きで、行内方向は左から右です。

CSS min-inline-size 属性は CSS 属性 min-height および min-width 非常に似ているが、 min-inline-size 属性は行内方向に依存しています。

例

例 1

行内方向の最小サイズを200ピクセルに設定する<div>要素の例：

div {
  min-inline-size: 200px;
}

自分で試してみてください

例 2：書き込みモード

<div>要素の writing-mode 属性値が vertical-rl に設定されている場合、行内方向が側向から下向きに変わります。これにより、min-inline-size 属性の動作が影響されます：

div {
  min-inline-size: 260px;
  writing-mode: vertical-rl;
}

自分で試してみてください

例 3：min-inline-size と inline-size

一つの inline-size 200pxの<div>要素と別の min-inline-size 200pxの<div>要素が内容のサイズが変わったときの異なる動作を見てください：

#div1 {
  min-inline-size: 200px;
}
#div2 {
  inline-size: 200px;
}

自分で試してみてください

CSS 文法

min-inline-size: auto|length|initial|inherit;

属性値

技術的詳細

ブラウザのサポート

テーブルの数字は、この属性を完全にサポートする最初のブラウザのバージョンを示しています。

相关页面

参考：CSS inline-size 属性

参考：CSS max-inline-size 属性

参考：CSS min-height 属性

参考：CSS min-width 属性

参考：CSS writing-mode 属性