min-width

Internet Explorer Netscape Opera Safari Firefox
6.0 7.0 8.0 8.0 9.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Нет Частично Да Да Да Да Да Да Да Да Да Да Да Да

 

CSS CSS2
Значение по умолчанию 0
Наследуется Нет
Применяется Ко всем элементам
Аналог HTML Нет

Описание

Устанавливает минимальную ширину элемента. Если окно браузера по ширине становится меньше заданной минимальной ширины элемента, то ширина элемента остается неизменной, а в окне появляется горизонтальная полоса прокрутки.

Значение ширины элемента будет вычисляться в зависимости от установленных значений свойств width, max-width и min-width. В табл. 1 показано, чем руководствуется браузер при совместном использовании указанных стилевых свойств.

Табл. 1. Ширина элемента
Значения свойств Ширина
min-width < width < max-width width
min-width > width > max-width min-width
min-width > width < max-width min-width
min-width < width width
min-width > width min-width
min-width > max-width min-width
min-width < max-width max-width

Данные из таблицы следует понимать следующим образом. Если значение ширины (width) меньше значения min-width, то ширина элемента принимается равной min-width.

Синтаксис

min-width: значение | проценты | inherit

Значения

В качестве значений принимаются пикселы (px), проценты (%) и другие единицы измерения, принятые в CSS. Отрицательные значения не допускаются. inherit наследует значение родителя.

Пример

<!DOCTYPE  HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  "http://www.w3.org/TR/html4/strict.dtd"> <html>  <head>   <meta http-equiv="Content-Type" content="text/html;    charset=windows-1251">   <title>Колонки без переносов</title>   <style  type="text/css">    #container  {     min-width: 420px; /* Минимальная ширина контейнера */    }    #col1 {     background-color: #fc0; /* Цвет фона колонки */     padding: 5px; /* Поля вокруг текста */     float: left; /* Обтекание по правому краю */     width: 150px; /* Ширина левой колонки */    }    #col2  {     background-color: #c0c0c0; /* Цвет фона колонки */     padding: 5px; /* Поля вокруг текста */     width: 250px; /* Ширина правой колонки */     float: left; /* Обтекание по правому краю */    }   </style>  </head>  <body>   <div id="container">    <div id="col1">Колонка 1</div>    <div id="col2">Колонка 2</div>   </div>  </body> </html>

Объектная модель

[window.]document.getElementById("elementID").style.minWidth

Браузеры

Internet Explorer до седьмой версии включительно не поддерживает значение inherit.