css властивість min-width

Властивість min-width використовується, щоб встановити мінімальну ширину елемента.

Це запобігає значенню властивісті width ставати меншим за значення min-width.

Значення ширини елемента розраховується в залежності від встановлених значень властивостей width, max-width і min-width.

Ширина елементу може дорівнювати значенню заданому для min-wіdth, коли значення min-wіdth більше за значення max-wіdth або width.

Дані з таблиці слід розуміти так, якщо ширина елемента (width) менше за значення min-width, то ширина стане рівною значенню min-width.

правити

Нотатка

Властвість min-width перевизначає властивості max-width та width.

автор: Svitlana правити

Нотатка

Якщо вікно браузера по ширині стає менше заданої мінімальної ширини елемента, то ширина елемента залишається незмінною, а у вікні з'являється горизонтальна смуга прокрутки.

автор: Svitlana правити

Нотатка

Ключові слова впливають на розрахунок ширини й висоти елементу(й не залежать від значення властивості box-sizing). Це не стосується до значень у одиницях довжини або процентах.

автор: Svitlana правити

+ додати пораду чи нотатку

Синтаксис

min-width: length|initial|inherit;

Властивість min-width може отримувати 3 значень:

length

Як значення приймаються пікселі (px), відсотки (%) і інші одиниці виміру, прийняті в CSS. Від`ємні значення не допускаються.

автор: Svitlana

правити

initial

Встановлює цю властивість в значення без задання

автор: Svitlana

правити

inherit

Успадкує значення властивості від свого батьківського елемента

автор: Svitlana

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
min-width	1.0	1.0	1.0	7.0	7.0

Підтримка: мобільні переглядачі

Переглядач
min-width	1.0	1.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

<button class="min">ok</button>
<button>ok</button>

.min {
    min-width: 150px;
}