Вопрос

Что окончательный способ имитировать минимальную ширину свойства CSS в Internet Explorer 6?Может лучше не пытаться?

Это было полезно?

Решение

foo { min-width: 100px }      // for everyone
* html foo { width: 100px }   // just for IE

(или предоставить IE отдельную таблицу стилей, используя условные комментарии)

Другие советы

Вы можете использовать выражение (как предлагает HBoss), но если вас беспокоит производительность, то лучший способ сделать это — добавить прокладку внутри элемента, к которому вы хотите применить минимальную ширину.

<div id="container">
  The "shim" div will hold the container div open to at least 500px!
  You should be able to put it anywhere in the container div.
  <div class="shim">&nbsp;</div>
</div>

#container .shim {
  width: 500px;
  height: 0;
  line-height: 0;
}

Это требует небольшой несемантической разметки, но является действительно кросс-браузерным решением и не требует дополнительных затрат на использование выражения.

Эта статья в CSS Play Стью Николлс показывает различные методы достижения минимальной ширины в IE во всех режимах (Quirks и т. д.) и даже для IE/Mac.

Я возился с каждым ответом, данным здесь в прошлом месяце.И поигравшись с методом Претаула(Минимальная ширина в MSIE 6), кажется, это лучшая альтернатива минимальной ширине.Никаких хаков или чего-то еще, просто совместимый CSS-код, реализация которого занимает 30 секунд.

Судя по Google, выражения кажутся наиболее популярными.В любом случае, у меня это привело к случайной блокировке моего браузера (как IE, так и FF).

Не знаю, у меня был некоторый успех:

    min-width: 193px;
    width:auto !important; 
    _width: 193px;  /* IE6 hack */

Комбинация быстрого взлома минимальной высоты Дастина Диаса и Как указать в HTML или CSS абсолютную минимальную ширину ячейки таблицы

сделайте свой тег CSS как _Width:500 пикселей или что-то еще.

Это работает очень хорошо...

div.container {
    min-width: 760px; 
    width:expression(document.body.clientWidth < 760? "760px": "auto" ); 
}

Быстрый хак минимальной высоты у меня работает (также работает для ширины)

Пример с прокладкой подходит для того, чтобы заставить браузер отображать горизонтальную полосу прокрутки, когда контейнер достигает определенного размера, но вы заметите, что размер содержимого в контейнере все равно будет изменяться по мере уменьшения окна.Я полагаю, что это не основная цель при попытке добиться минимальной ширины в IE 6.

Неполная техника минимальной ширины http://www.mediafire.com/imgbnc.php/260264acec99b5aba3e77c1c4cdc54e94g.jpg

Более того, использование выражений и других сумасшедших приемов CSS не является хорошей практикой.Они небезопасны и нечисты.Этот статья объясняет предостережения относительно хаков CSS и почему их следует вообще избегать.

Лично я считаю сообщение Scaryjeff лучшим советом по достижению истинной минимальной ширины в IE6, и как опытный разработчик CSS-разметки я еще не нашел лучшего решения, которое было бы применимо к проблемам такого рода.

Этот статья в CSS Play Стью Николлс показывает различные методы достижения минимальной ширины в IE во всех режимах (Quirks и т. д.) и даже для IE/Mac.

Я дал ответ на аналогичный вопрос, в котором подробно описано использование этого метода для правильного достижения минимальной ширины.Его можно посмотреть здесь:

CSS:Две колонки с 50% жидкостью, не соблюдающие минимальную ширину

Техника проста, валидный CSS, который можно использовать практически в любой ситуации.Применительно к приведенному выше примеру с прокладкой это приводит к тому, что я считаю правильной функциональностью минимальной ширины.

Правильная техника минимальной ширины http://www.mediafire.com/imgbnc.php/a67b2820bfbd6a5b588bea23c4c0462f4g.jpg

Кнопка одной строки

button{
background-color:#069;
float:left;
min-width:200px;
width:auto !important;
width:200px;
white-space: nowrap}

Используйте условные комментарии для ссылки на специальную таблицу стилей MSIE 6, затем создайте CSS, как показано ниже.

Совместимые браузеры будут использовать:

min-width: 660px;

Тогда MSIE 6 будет использовать:

width: expression((document.body.clientWidth < 659)? "660px" : "auto");
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top