메뉴나 버튼등의 앵커를 inline-block로 지정하여 배치할때
여타 브라우저는 전부 앵커 영역사이에 간격이 생기나
ie6,7에서는 붙어서 랜더링되는 현상이 있다.
이러한 경우가 발생할 시에는
-----------------------------------------------------------------------
<div class="btn">
<a class="complete" href="#complete" title="완료"></a>
<a class="cancel" href="#cancel" title="취소"></a>
</div>
-----------------------------------------------------------------------

이와같이 안에 내용을 넣어주면 나머지 브라우저와 동일하게 보임
class="hide"는 포지션을 날려주어 안보이게 하는 css속성을 적용시킨상태.
즉 눈에 보이지 않더라도 마크업상의 내용이 들어가면
ie6,7도 제대로 나온다는것.

----------------------------------------------------------------------- 
<div class="btn">
<a class="complete" href="#complete" title="완료"><span class="hide">완료</span></a>
<a class="cancel" href="#cancel" title="취소"><span class="hide">취소</span></a>
</div>
 ----------------------------------------------------------------------- 

css는 둘다 동일.
 .setting .btn a{display:inline-block;width:31px;height:18px}
.setting .btn a.complete{background:url("./images/spr_dictionary.gif") -115px -349px no-repeat}
.setting .btn a.cancel{background:url("./images/spr_dictionary.gif") -149px -349px no-repeat}
 
ie6에서 tr에 style border 안먹음.

 table td 안에 img태그로 이미지 삽입시.
아래 픽셀이 뜨게되는데 img의 style안에

vertical-align:top 주면 해결됨 
ie6 : 속성이름 앞에 _

ie7이하 : 속성이름 앞에 *

ie8이하 : 속성값 뒤에 \9

 
BLOG main image
바람꽃 by 미역~

공지사항

카테고리

분류 전체보기 (200)
사는이야기 (150)
개발이야기 (7)
예술이야기 (25)
Total : 18,014
Today : 12 Yesterday : 39