1

주제: 그.. IE와 FF의 magin값과 padding값의 해석 차이

제목을 이어...

그.. IE와 FF의 magin값과 padding값의 해석 차이
에 대한 정보 링크나 아시는 정보 좀 얻을수 있을까요?

제가 아는 내용은..

<div style="padding:5px; width:100px;">NearFondue</div>

FF에서 실제 표시되는 영역의 width와 height는 padding을 포함한 후 110px 로 나올 것이고,
IE에서는 padding이 포함되지 않은 100px 로 나올 것이다.

이정도 인데.
위의 한가지만 가지고도 1px의 차이가 엄청난 레이아웃에 있어 난감한 점이 참 많아요 ㅠ


더불어..
제가 다시금 php책을 열었습니다.
이제 여러분들은 긴장...












하지 않으셔도 됩니다.

이 책의 1페이지를 시작한지 2년이 넘어갑니다. 2년동안 70여페이지 봤지요..
중간 챕터 넘어가고 갑자기 발등의 불을 끄기위해 데이터베이스로 넘어갑니다.

LonnieNa (2006-08-09 15:40:24)에 의해 마지막으로 수정

텍스트큐브를 이용하시다 불편하신 점 있으시면 아래로 연락주세요.
Needlworks/TNF - LonnieNa
nateon : y12x2 (a.t) nate.com / mail : lonniena (a.t) needlworks.org
http://twitter.com/@textcube

2

답글: 그.. IE와 FF의 magin값과 padding값의 해석 차이

간단하게, XHTML DTD를 쓰시면 해결됩니다.... =3 (문제는 IE6보다 낮은 아래 버전들인데, 이 경우는 IE 전용 CSS를 달아주는 수밖에 없을 겁니다)

아니면 div를 두 겹으로 만들어서 바깥쪽에 padding만 적용하고, 안쪽에 width만 적용하는 방법도 있죠.

daybreaker (2006-08-09 16:11:58)에 의해 마지막으로 수정

문제의 답은 우리 안에 있다.
내면에 귀를 기울여 보자.

3

답글: 그.. IE와 FF의 magin값과 padding값의 해석 차이

min-width 등을 이용해주는것도 방법이긴 합니다만 그 어떤 쪽을 쓰던지간에 IE 핵은 피해갈 수 없습니............
가장 간단한건 padding을 배제하고 margin으로만 마크업을 하는겁니다. 캬하하하.

(단, margin으로 마크업할 때 주의사항이라면
margin과 float 동일한 방향 마크업일 때 해당 방향 margin 값이 IE에서는 2배가 되는 버그가 있으므로 display: inline;을 넣어줄것. 정도.)

하늘은 스스로 삽질하는 자를 삽으로 팬다