2010-12-17 2 views
1

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

ответ

2

Во-первых, вы должны знать следующее:

  • Содержимое принадлежит в HTML (Model)
  • Стили принадлежат CSS (View)
  • взаимодействия принадлежат JavaScript (контроллер)

CSS может содержать в HTML в атрибутах style, хотя этого следует избегать, если это необходимо.

Свойство CSS min-height выполняет то, что вы ищете, хотя в IE6 не работает. Существует исправление для IE6, это происходит следующим образом

.yourstyle 
{ 
    height: auto !important; 
    height: 500px; 
    min-height: 500px; 
} 

Убедитесь, что height и min-height значения идентичны.

+0

В любом случае внутри css, который вместо абсолютного значения для этой высоты я мог бы сказать ему использовать значение высоты другого элемента на странице , Или это нужно сделать со сценарием? – Brendan

+1

@Brendan Я не тестировал это, но я предполагаю, что процентные значения будут работать для родителя (т.е. высота: 100%; min-height: 100%). Вы не можете выбрать какой-либо другой элемент на странице. Из его звуков вы просто ищете способ иметь столбцы с равной высотой в многоколоночном макете. Быстрое решение - предоставить родительскому колону фон, который вы хотите отобразить на странице. – zzzzBov

+0

Вот ссылка на пример страницы на сайте, который делает то, что я пытаюсь объяснить: http://www.triptac.org/HelpDesk/TAG/Default.html Основная область содержимого страницы не так высока, как боковая панель рядом с ней. Боковая панель и эта область содержимого имеют один и тот же родительский элемент. Однако, если я использую 100% для значения min-height, это не сработает, хотя из всего, что я видел, должно. Может быть, вы можете взглянуть на него и посмотреть, есть ли у вас какие-нибудь идеи? – Brendan

3

В CSS2 совместимые браузеры вы можете использовать мин-высота: http://www.w3.org/TR/CSS2/visudet.html#min-max-heights

Хотя для не совместимых браузеров (гм IE6), вы должны найти другой способ для его реализации.

Вы можете увидеть CSS совместимость свойство здесь: http://www.quirksmode.org/css/contents.html

+0

Некоторые из этих сайтов могут использовать IE6, и я хотел бы сделать его совместимым. Есть ли способ сделать это в реальном HTML-коде? – Brendan

+0

@Brendan Есть способы заставить IE6 вести себя ... например: http://code.google.com/p/ie7-js/ –

+1

Для элементов, которые имеют 'overflow: visible', IE6 будет обрабатывать' height' как 'min-height' (другая ошибка). Установите 'height' в таблице стилей только для IE6 (за условным комментарием, например). – Quentin

Смежные вопросы