Что делает min-height: 100%, когда ничто не имеет явной высоты?

У моего университетского веб-сайта есть странная проблема только в Opera 12.xx (насколько мне известно), где весь контент нелепо разнесен, с гигантскими разделами пустого пространства, разделяющими все разделы.

Когда я проверил CSS, я заметил, что несколько контейнеров имеют свойство min-height: 100% подходя к html а также body, но ни один из промежуточных родителей не имел явно определенной высоты. Я предполагаю, что Opera повторяла весь путь вверх по дереву DOM и, поскольку она достигла вершины, сделала все это по крайней мере на 100% высоты области просмотра.

Исходя из моего понимания CSS, похоже, что должно происходить. Мой вопрос (ы), тогда:

  • Это то, что должно происходить, или я что-то неправильно понимаю?
  • Если так, то почему эта проблема касается только Opera 12? (Опера 15 защищена, потому что она использует Webkit, я знаю. Я имею в виду, почему Webkit отображает его нормально?)
  • Какой смысл всех этих объявлений минимальной высоты? Кажется, что (опять же, в моем понимании) нет ответа на все 100%, и разве это не заставляет элементы, отмеченные как основывать их рост, на содержании их родителей, а не на их собственном? Какой в ​​этом смысл?

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

1 ответ

Решение

Если вы сомневаетесь, обратитесь к спецификации:

Если высота содержащего блока не указана явно (т. Е. Зависит от высоты содержимого), и этот элемент не является абсолютно позиционированным, процентное значение обрабатывается как "0" (для "min-height") или "нет" (для "максимальной высоты").

Поведение Opera не согласуется с тем, что указано в спецификации, так что это ошибка браузера.

Другие вопросы по тегам