파폭에서 레이아웃 잡을때 질문입니다~ 정보
기타 파폭에서 레이아웃 잡을때 질문입니다~본문
안녕하세요.
초보인데요.. CSS와 DIV를 이용해서 레이아웃을 잡아봤는데..
익스에선 잘 되는데.. 파폭에서는 안되네요.. (높이도 안맞고 폭도 안맞고..ㅠㅠ)
이걸 어떻게 두 브라우져에서 정상 작동 시킬지 도와주세요~
초보인데요.. 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>
입니다. 꼭좀 도와주세요~
추천
0
0
댓글 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>
아래와 같이 해보세요.*로 시작하는 부분참조.(익스핵)
<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을 씌우게 되면 어떻게 되는지.. 아~ 빨리 퇴근하고 해봐야겠네욤~^^
감사합니다.
모두 이런방식으로 하시는거 맞나욤?
혹 wrap을 씌우게 되면 어떻게 되는지.. 아~ 빨리 퇴근하고 해봐야겠네욤~^^
감사합니다.
핵은 어쩔수 없을경우 사용하게 됩니다.CSS게시판이나 인터넷 둘러보시면 핵없는 좋은 예제들이 많이 있습니다.
CSS 비밀 메뉴얼이란 책에 자세히 나와 있어요 ^^
거기보면 둘다 똑같이 동작하도록 하게하는 꼼수들이 들어 있습니다.
책내용이 워낙 많아서 다 소개시켜 드리지는 못하지만...
제가 확실히 하나 알고 있는건..
DIV나 이런걸 총칭해서 박스라 칭하죠?
박스들의 width를 지정할 때에는 left right의 padding이나margin, border를 지정하면 안되고요 그렇게하면 익스와 파폭에서 다르게 표시됩니다.
박스들의 height를 지정할 때에는 top bottom의 padding,margin,border를 지정하면 다르게 표시되죠
익스와 파폭의 기준이 달라서 그런건데요..
실제 너비에 margin,padding,border를 포함시키느냐 안시키느냐에 따라서 둘이 나뉘어 져요..
그래서 대부분 wrap을 씌워서 표현하곤 합니다.
핵을 쓰는 방법도 좋은 방법중의 하나가 되죠^^
거기보면 둘다 똑같이 동작하도록 하게하는 꼼수들이 들어 있습니다.
책내용이 워낙 많아서 다 소개시켜 드리지는 못하지만...
제가 확실히 하나 알고 있는건..
DIV나 이런걸 총칭해서 박스라 칭하죠?
박스들의 width를 지정할 때에는 left right의 padding이나margin, border를 지정하면 안되고요 그렇게하면 익스와 파폭에서 다르게 표시됩니다.
박스들의 height를 지정할 때에는 top bottom의 padding,margin,border를 지정하면 다르게 표시되죠
익스와 파폭의 기준이 달라서 그런건데요..
실제 너비에 margin,padding,border를 포함시키느냐 안시키느냐에 따라서 둘이 나뉘어 져요..
그래서 대부분 wrap을 씌워서 표현하곤 합니다.
핵을 쓰는 방법도 좋은 방법중의 하나가 되죠^^
