스타일 zoom

CSS 2010. 4. 6. 10:03

코바코 관리자 포탈에 투입되서 다른 사람이 해 놓은 작업물을 수정하다 스타일 zoom을  발견했다. *를 보아하니 핵같긴 한데 뭐하는 놈인가 해서 찾아보았다.


<div class="out">
<div class="left">왼쪽</div>
<div class="right">오른쪽</div>
</div>

<style type="text/css">
.left { float:left;}
.right { float:right;}
</style>

 


위와같이 코딩하면 out 클래스의 division 태그가 높이가 잡히지 않습니다.
.out { *zoom:1; } /* 안의 float 요소까지 높이를 잡아주지만 이것은 ie5~7에서만 가능합니다. */
.out:after { content:""; clear:both; display:block; } /* 높이를 잡아주지만 ie5~7에서 지원하지 않습니다. */
*zoom:1 이 사용되는 영역은 위 두가지 스타일이 모두 적용되어 있을 것입니다.

 

 

>>출처 : XE 묻고답하기


위 방법은 zoom 을 이용한 방법이고....아래는 내가 쓰던 방법이다.

 

<style type="text/css">
.left { float:left;}
.right { float:right;}
.clear{clear:both;}
</style>

 


<div class="out">
<div class="left">왼쪽</div>
<div class="right">오른쪽</div>
<div class="clear"></div>
</div>

'CSS' 카테고리의 다른 글

CSS속성 선언 순서  (0) 2010.04.22
display: block과 inline  (2) 2010.04.15
제목이나 디자인적 요소를 감출시..  (0) 2010.04.14
텍스트에 의한 테이블 늘어남 방지  (0) 2010.04.08
font 와 background 대표속성  (0) 2010.04.06
: