div, css구조에 대한 궁금...
소심한녀자
style
*{font-family: malgun gothic, Arial;}
body{margin:0; padding:0;}
div{}
ul,li{list-style:none;}
img{border:0px;}
a:hover, a:active, a:focus, a:link, a:visited, a:img{text-decoration: none;}
.hand{cursor: pointer;}
.f12{font-size:12px;}
.fl{float:left;}
.topmenu{width:100%; height:50px; background:#ff0000;}
.leftmenu{width:200px; height:auto; background:#ff99ff;}
.main{width:100%; height:auto; background:#ff9933;}
.maintab{width:100%; height:25px; background:#0000ff;}
.mainbody{width:100%; height:auto; border:solid 1px; #000;}
.footer{width:100%; height:30px; background:#ff0000; text-align:center;}
/style
body
div class=topmenu
div class=flimg src=images/logo.png/div
div class=fl
ul
li class=flmenu01/li
li class=flmenu02/li
li class=flmenu03/li
li class=flmenu04/li
li class=flmenu05/li
li class=flmenu06/li
/ul
/div
/div
div class=leftmenu fl
d
/div
div class=main fl
div class=maintab
ul
li class=fl style=tab/li
li class=fl style=tab/li
li class=fl style=tab/li
li class=fl style=tab/li
li class=fl style=tab/li
/ul
/div
/div
div class=mainmain/div
div class=cb footer f12footer/div
/body
이렇게 작업했더니
1번과 같이 나왔어요. 2번같이 나오게 하고 싶은데... 말이죠
그리고 왼쪽 메뉴 고정 200px을 주었을때 tab과 main는 가변으로 늘었다 줄었다 하고 싶은데
방법이 없을까요?
-
민구
그럼 왼쪽메뉴는 absolute로 고정시키시고, tab,main을 묶은 박스를 왼쪽에서 200px떨어뜨리시고 tab하고 main에 100% 줘보세요
-
뭘봐요
width값을 일부러 안줄이려고 하는게 아니라
left메뉴 넓이를 고정으로 200px로 주고 tab,main영역이 창이 줄었다 늘었다 할때 %로 주고 싶은데
일단 잡은 값이 100%로 준거예요. -
Schokolade
개인적으로 clear:both보다 float를 묶고 있는박스에 overflow:hidden을 주거나 가상선택자로 해제하는 방법을 추천드립니당..
width를 왜 줄이지 않으려고 하시는거에요? -
상처주지마
clear;both주면 float이 해제 되는건 알겠는데...
width넓이를 줄여주는 방법 외에
다른 방법은 없을까요? -
Orange
tab을 감싸고 있는 main에 width:100%가 있으니 당연히 탭이 밑으로 갑니당
그리고 float해제하는 법에 대해 알아보셔야 할듯 -
나샘
float:left 추가해서 넣었습니다.
-
늘빈
fl 마크업에만 주신듯
-
은솜
float:left 추가해서 넣었습니다.
-
지존
중간아이들에게 float이 필요합니다