{overflow: hidden} и {position: relative} в IE
- Опубликовано:
В IE 6/7 абсолютно (position: absolute
) или относительно (position: relative
) позиционированные блоки имеют обыкновение игнорировать объявление overflow: hidden
содержащего их элемента (контейнера) и преспокойно выступать за пределы его границ.
Для решения этой проблемы достаточно задать относительное позиционирование (position: relative
) самому контейнеру:
- CSS:
/* дочерний элемент */
#child {background: #ссс; position: relative; top: -25px; }
/* содержащий его контейнер */
#parent {overflow: hidden; position: relative; height: 50px; }- HTML:
<div id="parent"><div id="child">example</div></div>