메뉴나 버튼등의 앵커를 inline-block로 지정하여 배치할때 여타 브라우저는 전부 앵커 영역사이에 간격이 생기나 ie6,7에서는 붙어서 랜더링되는 현상이 있다. 이러한 경우가 발생할 시에는 ----------------------------------------------------------------------- ----------------------------------------------------------------------- 이와같이 안에 내용을 넣어주면 나머지 브라우저와 동일하게 보임 class="hide"는 포지션을 날려주어 안보이게 하는 css속성을 적용시킨상태. 즉 눈에 보이지 않더라도 마크업상의 내용이 들어가면 ie6,7도 제대로 나온다는것. ----------------..
ie6에서 tr에 style border 안먹음. table td 안에 img태그로 이미지 삽입시. 아래 픽셀이 뜨게되는데 img의 style안에 vertical-align:top 주면 해결됨
ie6 : 속성이름 앞에 _ ie7이하 : 속성이름 앞에 * ie8이하 : 속성값 뒤에 \9
ie6,7을 제외한 나머지 position:absolute 먹이면 그냥 offset parent로부터 좌상단 ie7 저것만 먹이면 영역 밖에 형성됨 left,right,top,bottom 수치를 주면 제대로 표현됨 ie6 저렇게 해도 그전 형제 div들이 float:left상태로 영역을 꽉 차지하고있다면 밖에 생성됨. clear:both 먹이면 동일하게 됨.
빈 태그의 영역에 css line-height:0;font-size:0 를 적용시키면 해결
위와 같이 하고 css를 .gnb .gnb_menu1{float:left;width:110px;height:45px} .gnb .gnb_menu2{float:left;width:90px;height:45px} .gnb .gnb_menu3{float:left;width:120px;height:45px} 이와같이 블럭형태에 좌로 붙여도 계단현상과 같은 버그가 ie6,7에서 왕왕일어남 이를 바로잡는 법은 감싸고 있는 li에 display:inline 해주면됨
css3에서 추가되긴 했음. background-size: 200px 50px 이런식으로 가능