익스플로러(IE)에서 overflow:hidden 안먹히는 이유

div 속성중 overflow:hidden 은 div 레이아웃을 깨지지 않게 하는 중요한 요소입니다.

 

아무리 사이즈 조절을 잘해도 옆어로 죽~ 늘어나는 게시물에는 대책이 없죠;;

그런데 overflow:hidden 이 IE에서 잘 안먹히는 겁니다!!!!!

 

 

익스플로러9 버젼부터는 고쳐졌기를 바라지만 IE8, IE7 은 이방법을 꼭 써야 overflow hidden 이 됩니다.

바로 익스플로러는 width style을 꼭 지정해 줘야해요.

 

ex) <div style='overflow:hidden; width:'100%'></div>

 

물론 width 속성은 px 로 지정해 줘도 되고요 뭐든 상관없는데 꼭 저 width 가 들어가 있어야 합니다!!!

다른 브라우져에서는 상관없는데 익스플로러에서는 hidden이 안되고 옆으로 늘어납니다.

주의 사항

 

여기에 포지션 relative 놓고, 그 안에것들을 레이어로 띄우면 참 곤란해지죠

어디까지나 그때 그때 상황에 맞춰가며 필요한 방법을 써야 할 것 같아요~

 

지금 현재 해법으로는 overflow:hidden; 을 걷어내고 

display:inline-block; 을 넣어서 해결을 하고 있습니다.

참고자료
http://littlecandle.co.kr/bbs/board.php?bo_table=codingnote&wr_id=82

http://doctype.kr/blog/226