Vlastnosť min-width

Vlastnosť min-width nastavuje minimálnu šírku prvku. Hodnotou vlastnosti sú akékoľvek jednotky pre veľkosti alebo kľúčové slovo none, čo znamená žiadnu hodnotu.

Zvyčajne sa nastavuje pre prvok s plávajúcou šírkou (šírka je zadaná v percentách alebo nie je zadaná vôbec, a prvok sa podľa šírky roztvára svojím obsahom). Ak je šírka prvku zadaná v percentách - pri zmenšovaní okna prehliadača sa bude zmenšovať, kým nedosiahne hodnotu min-width.

Syntax

cssselektor {
  max-width: hodnota;
}

Príklad

V tomto príklade šírka tvorí percento zo šírky rodiča. Zmenšite okno prehliadača v šírke a kontajner sa tiež zmenší, aby sa prispôsobil šírke okna prehliadača. Avšak bude sa zmenšovať len do veľkosti, definovanej v min-width, to je 400px. Akonáhle kontajner dosiahne túto šírku - prestane sa zmenšovať:

html<div id="elem"></div>

css#elem {
  width: 70%;
  min-width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

Príklad

V tomto príklade je šírka kontajnera obmedzená z oboch strán: nebude sa môcť stať väčšia ako 900px a menšia ako 400px:

html<div id="elem"></div>

css#elem {
  width: 70%;
  min-width: 400px;
  max-width: 900px;
  height: 100px;
  border: 1px solid black;
}

Результат:

Pozrite tiež