묻고답하기
로그인 위젯 폼입력텍스트의 세로를 중앙정렬하고 싶습니다.
2012.08.01 21:56
CSS 초보여서 그런지...
현재 레이아웃이랑 로그인 위젯을 직접 개발하고 있습니다.
사이트 입니다.
해당 사이트의 로그인 위젯을 IE8 버전에서 보시면,
로그인 id/pass 폼에 들어가는 텍스트의 세로가 상단(top)에 붙어서 나오는데요.
이를 세로 중앙 정렬을 하고 싶습니다.
대충 폼 부분의 css 부분은 아래와 같습니다.
.login_default {width:400px; margin:0; padding:0; border:0;}
.login_default legend {display:none; width:0; height:0; overflow:hidden; font-size:0;}
.login_default form {position:relative; padding:0 0 15px 0; border:1px solid #161415; background-color:#161415; overflow:hidden;}
.login_default form .idpwWrap {_display:inline-block; margin:0; padding:20px 0 0 20px; clear:both; overflow:hidden;}
.login_default form .idpw {float:left; width:200px;}
.login_default form .idpw input {float:left; color:#666; width:200px; height:29px; margin:1px 0; background:#595959; padding:2px 3px; font:14px Dotum, Verdana; color:#FFFFFF; font-weight:bold; overflow:hidden;}
.login_default form .idpw input.idOff {border:3px solid #595959; background:#595959 url(../images/default/login_id.gif) no-repeat 2px 0px;}
.login_default form .idpw input.idOn {border:3px solid #07a58d; }
.login_default form .idpw input.passOff {border:3px solid #595959; background:#595959 url(../images/default/login_pass.gif) no-repeat 2px 0px;}
.login_default form .idpw input.passOn {border:3px solid #07a58d;}
.login_default form .login {position:absolute; top:102px; right:22px; margin:0; padding:0;}
*+html .login_default form .login {top:61px;}
.login_default .top_openid {height:81px; padding:0px 0 0 0px; background-color:#161415; overflow:hidden;}
.login_default .top_openid input {width:13px; height:13px; margin:-2px 0 0 0; padding:0; vertical-align:middle;}