수다닷컴

혼자 일주일동안 책보고 끙끙 거리는데..
로그인 첫 페이지를 만드는 중입니다.

그냥 웹페이지 중앙에,아래 그림처럼로그인 영역 하나 이렇겐데요,
그 영역 안에 들어갈 레이아웃을 작업하다가 너무 복잡해지는 것 같아서요..
title무제 문서/title
link href=로그인화면/login_cs.css rel=stylesheet type=text/css /
/head
body
div id=loginpage_background
div id=loginpage_left
div id=loginpage_logoimg src=로그인화면/logo.png align=right//div
div class=loginpage_title_text★★★★/div
div class=loginpage_subtitle_text★★★★★★/div
/div
div id=loginpage_bar
div align=rightimg src=로그인화면/bar_0.gif /
/div
/div
div id=loginpage_right
div id=loginpate_status_out
div id=loginpate_status_title
form
ul
lilabel for=id사용자/label
input name=id type=text size=10 /
/li
lilabel for=pw비밀번호/label
input name=pw type=password size=10 /
/li
/ul
/form
/div
div id=loginpate_status_button로그인/div
/div
/div
/div
/div
/body

/html================================================================================

외부css입니다..

#loginpage_background{ flote:right; width:800px; height:114px;background-color:#efefef;}
#loginpage_left{width:265px; height:114px; margin:auto; float:left;}
#loginpage_logo{width:265px; height:79px;}
#loginpage_title{width:297px; height:35px;}
.loginpage_title_text{
padding-bottom:4px;
color:#2c2c2c;
font-family: 굴림, Gulim, AppleGothic, Sans-serif;
font-size: 15px;
font-weight: bold;
text-align:right;
letter-spacing:-1px;
}
.loginpage_subtitle_text{
color:#2c2c2c;
font-family: Arial;
font-size: 9px;
text-align:right;
}
#loginpage_bar{
width:30px;
height:114px;
margin:auto;
float:left;
}
#loginpage_right{width:400px; height:114px; margin:auto; float:left;}
#loginpate_status_out{width:100%; height:47px;}
#loginpate_status_title{ float:left; height:47px; width:250px;}
#loginpate_status_title ul{list-style:none;}
#loginpate_status_title ul li{list-style:none;}
.login_status_title_text{
font-family: 굴림, Gulim, AppleGothic, Sans-serif;
font-size: 12px;
font-weight: bold;
text-align:reft;
color:#2c2c2c;
}
#loginpate_status_input{ float:left; height:47px; width:110px;}
#loginpate_status_button{
float:right;
height:47px;
width:69px;
background-color:#3984e2;
font-family: 굴림, Gulim, AppleGothic, Sans-serif;
color:#ffffff;
font-size:12px;
font-weight: bold;
text-align:center;
vertical-align: middle;
text-shadow:1px 1px #16539f;
}
li label{
width:65px;
float:left;
font-size:12px;
font-weight:bold;
color:#2c2c2c;
}위에 소스가 저런데.. div를 제가 너무 많이 쓴것같은데,
어떻게 하면 좀더 깔끔하게 정리가 될까요?

신청하기