본문
ex) body {letter-spacing:-1px;}
위와 같을때 IE에서 br 태그 두번 적용시 한칸으로 인식해버립니다. (IE8 제외)
letter-spacing:-1px; 적용시
적용한 소스보기
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>br 테스트1</title>
<style type="text/css">
body {font-size:12px; line-height:18px; letter-spacing:-1px;}
</style>
</head>
<body>
동해물과 백두산이 마르고 닳도록<br />
하느님이 보우하사 우리 나라만세<br />
<br />
무궁화 삼천리
</body>
</html>
letter-spacing:-1px; 적용하지 않을시
소스보기
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>br 테스트1</title>
<style type="text/css">
body {font-size:12px; line-height:18px;}
</style>
</head>
<body>
동해물과 백두산이 마르고 닳도록<br />
하느님이 보우하사 우리 나라만세<br />
<br />
무궁화 삼천리
</body>
</html>
해결방법
css 기본정의시 아래와 같이 삽입
br {letter-spacing:0;}
DTD가 없을때는 IE8에서도 br 이 두개일경우 하나로 인식해버립니다. 이유인즉 IE8에서는 DTD가 없을경우 Quirks Mode 모드로 렌더링하기 때문입니다.
관련링크
댓글목록
등록된 댓글이 없습니다.