Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Отключать видимость при нулевой высоте, или не отключать? (https://javascript.ru/forum/misc/19988-otklyuchat-vidimost-pri-nulevojj-vysote-ili-ne-otklyuchat.html)

revvo 06.08.2011 11:42

Отключать видимость при нулевой высоте, или не отключать?
 
Делаю анимацию, прячу и показываю элемент интерфейса. Когда я ему задаю высоту 0, он ведь все равно не видим. Стоит ли отключать ему видимость - display: none; ? Я не вижу смысла. Но может есть подводные камни, и подводные грабли, о к-рых я не знаю? :)

B@rmaley.e><e 06.08.2011 11:45

Прятать через height: 0 не очень удачная идея. IE6, например, трактует height как min-height, да и при нулевой высоте, емнип, элемент может быть виден из-за паддингов.
Лучше использовать display:none для скрытия

revvo 06.08.2011 13:22

Дело даже не в том, что я его так прячу, просто я все равно анимацию делаю, так или иначе я его свожу к нулю. Вот и думаю, а нужно ли дополнительно еще прятать.

IE6 меня не интересует, можно забить.

Паддингов нет, это никак не мешает.

Еще есть аргументы? :)

monolithed 06.08.2011 13:58

После того как значением становится нуль, нужно делать как сказал B@rmaley.e><e

revvo 08.08.2011 20:59

Цитата:

Сообщение от monolithed (Сообщение 118140)
После того как значением становится нуль, нужно делать как сказал B@rmaley.e><e

Что значит нужно? Аргументировать можете? Я не докапываюсь, мне интересно просто понять.

devote 09.08.2011 02:28

Цитата:

Сообщение от revvo
Что значит нужно? Аргументировать можете? Я не докапываюсь, мне интересно просто понять.

Ну а для чего по твоему в стандарт CSS добавили свойство display? Если бы блок можно было прятать просто уменьшив его значение высоты, сомневаюсь что ввели бы такое свойство как display. Установив height в нулевое значение, не всегда можно быть уверенным в том что блок скроется полностью. Нужно учитывать такие свойства как line-height, font-size, padding, margin, border и т.д. тоесть установив значение height в нулевое значение, нужно позаботиться и о свойствах что я описал выше что бы элемент 100% был скрыт, для этого и ввели свойство display с параметром none что бы не мучатся с тем что я описал выше. Так же не забываем о наследуемых/глобальных свойствах.

B@rmaley.e><e 09.08.2011 13:43

height: 0 не скрывает элемент
<style type="text/css">
#parent {backgroud: red; height: 0; width: 100px}
#child {background: blue; height: 100px; width:100px;}
</style>

<div id="parent">
  content
  <div id="child">
    child content
   </div>
</div>

walik 09.08.2011 16:07

B@rmaley.e><e,
Если добавить overflow: hidden; то элемент будет скрыт)))

Но вот от бордера overflow не спасет, так что однозначно ставить display: none надо

B@rmaley.e><e 09.08.2011 17:39

Цитата:

Сообщение от walik
Если добавить overflow: hidden; то элемент будет скрыт

Это. в свою очередь, повлечёт:
1. Создание контекста форматирования (Не факт, что плохо, но это какой-то side-effect)
2. Невозможность вынести дочерний блок за пределы родительского позиционированием.

Ну и я уже не говорю о двух свойствах против одного. Которые, опять же, не предназначены для скрытия элемента.


Часовой пояс GMT +3, время: 14:50.