MyTetra Share
Делитесь знаниями!
О, смотри-ка какое хорошее место. Дайте два!
Кроссбраузерный min- и max-width на чистом HTML+CSS
15.02.2011
14:56
Раздел: Компьютер - Программирование - HTML и CSS

Давно хотел поделиться одной интересной наработкой — а именно эмуляцией свойств min и max-width без использования expression и подобных вещей. Обвязка может показаться громоздкой, но главный ее плюс — она работает. Плюс подобные вещи можно с легкостью внедрять с помощью шаблонизатора одной строчкой кода.

Суть трюка проста:

‹table›‹tr›‹td width=1100› — максимальная ширина

‹div width=900 /› — распорка, минимальная ширина

Причем именно так, ширина не у таблицы, а у ячейки. Таким образом шире, чем 1100 таблица не будет (в данном случае), но при этом если она уже — скроллер не появляется. При этом если ширина рабочей области менее 900 — скроллер уже отобразится.

Проверено под разными ОС в браузерах:

  • Firefox: 3.5.2, 3.0.13, 2.0.0.16
  • IE: 8, 8 в режиме 7, 6
  • Opera: 10, 9.64, 9.2, 8.0
  • Safari: 4.0, 3.4
  • Chrome: 2.0.172.43

Так же в этом разделе:
← Содержание ...
 
MyTetra Share v.0.35
Яндекс индекс цитирования