테스트 사이트 - 개발 중인 베타 버전입니다

파폭에서 레이아웃 잡을때 질문입니다~

· 17년 전 · 1598 · 5
안녕하세요.

초보인데요.. CSS와 DIV를 이용해서 레이아웃을 잡아봤는데..

익스에선 잘 되는데.. 파폭에서는 안되네요.. (높이도 안맞고 폭도 안맞고..ㅠㅠ)

이걸 어떻게 두 브라우져에서 정상 작동 시킬지 도와주세요~

<style type='text/css'>

#top { width:800px;border:1px solid;height:100px;text-align:center;font:20px bold;padding-top:35px;
	background:#c8c8c8;
	}
#left {height:600px;width:200px;float:left;border:1px solid;padding:10px 0 0 5px;font-size:15px;
	}
#right {height:600px;width:600px;float:left;border:1px solid;padding:20px 5px 5px 5px;}

</style>


<body 부분>
<div id=top>top 부분 </div>
<div id=left>Left 부분 </div>
<div id=right>Right 부분 </div>


입니다. 꼭좀 도와주세요~






댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 5개

파이어폭스는 패딩값과 보더값을 넓이와 높이에 포함시킵니다.
아래와 같이 해보세요.*로 시작하는 부분참조.(익스핵)

<style type='text/css'>

#top { width:798px;border:1px solid;height:63px;text-align:center;font:20px bold;padding-top:35px;
background:#c8c8c8;
}
*html #top{width:800px;height:100px;}

#left {height:589px;width:193px;float:left;border:1px solid;padding:10px 0 0 5px;font-size:15px;
}
*html #left {width:200px;height:600px;}

#right {height:573px;width:588px;float:left;border:1px solid;padding:20px 5px 5px 5px;}
*html #right {width:600px;height:600px;}
</style>
감사합니다. 이게 웹표준인가요? 움,., 영 까다롭군요~

모두 이런방식으로 하시는거 맞나욤?

혹 wrap을 씌우게 되면 어떻게 되는지.. 아~ 빨리 퇴근하고 해봐야겠네욤~^^

감사합니다.
핵은 어쩔수 없을경우 사용하게 됩니다.CSS게시판이나 인터넷 둘러보시면 핵없는 좋은 예제들이 많이 있습니다.
링크 참조 하시기 바랍니다.
http://www.sodapop.co.kr/bbs/board.php?bo_table=tutorial&wr_id=11
CSS 비밀 메뉴얼이란 책에 자세히 나와 있어요 ^^
거기보면 둘다 똑같이 동작하도록 하게하는 꼼수들이 들어 있습니다.

책내용이 워낙 많아서 다 소개시켜 드리지는 못하지만...

제가 확실히 하나 알고 있는건..
DIV나 이런걸 총칭해서 박스라 칭하죠?
박스들의 width를 지정할 때에는 left right의 padding이나margin, border를 지정하면 안되고요 그렇게하면 익스와 파폭에서 다르게 표시됩니다.
박스들의 height를 지정할 때에는 top bottom의 padding,margin,border를 지정하면 다르게 표시되죠

익스와 파폭의 기준이 달라서 그런건데요..
실제 너비에 margin,padding,border를 포함시키느냐 안시키느냐에 따라서 둘이 나뉘어 져요..

그래서 대부분 wrap을 씌워서 표현하곤 합니다.

핵을 쓰는 방법도 좋은 방법중의 하나가 되죠^^

게시글 목록

번호 제목
9372
3068
3065
3061
3047
3043
3037
3028
9362
3014
3009
3007
9360
9358
9355
9354
3004
9349
9340
9338
9335
3000
9334
9333
2997
2992
2985
2980
9331
2976
2969
6947
2959
9307
2956
6945
2951
2948
9296
2944
9279
9276
9265
6936
9261
9256
게시판 숲시안 4
6934
9254
9242
9238
9232
2938
9216
2927
2923
2919
2911
2909
9207
외부로그인 로그인입니다. 8
2907
2906
9203
2905
2904
9194
2899
9189
9186
2892
2889
6929
2877
2865
9182
9176
9169
9164
2864
9162
2857
9156
2850
9151
회원통합스킨 로그인페이지 4
5971
9145
9132
9119
9113
9107
외부로그인 로그인 페이지 5
9096
9088
9049
2842
2837
2836
9037
9034
2833
2832
2829