2013-11-11 4 views
0

, когда я пытаюсь сфокусироваться на полях ввода формы, как только я отпущу мышь, она не активна. Я пытаюсь создать трехстоечную веб-страницу, в которой форма находится на правой панели. .Форма входа в систему не активна

HTML-код для

форм-
<div> 

<div class="container"> 
<div class="login"> 
<h3>Login Window</h3> 
<form method="post" action=" "> 
<p><input type="text" name="login" value="" placeholder="Username" class="logininput"></p> 
    <p><input type="password" name="password" value="" placeholder="Password" class="logininput"></p> 
    <p class="submit"><input type="submit" name="commit" value="Login" class="loginsubmit"></p> 
    </form> 
</div> 
<div class="login-help"> 
    <p><a href="forgot.html">Forgot your password</a></p> 
</div> 
</div> 

</div> 

и CSS-код, я использую

IS-
.container {margin:0; 
width: 100%; 
height:180px;} 

.login{position:relative; 
margin: 0 auto; 
padding:0; 
width:100%; 
background: white; 
border-radius: 3px; 
} 
.login h3{margin:0; 
font-size: 15px; 
font-weight: bold; 
color: #555; 
text-align: center; 
text-shadow: 0 2px white; 
background: #f3f3f3; 
border-bottom: 1px solid #cfcfcf;border-radius: 3px 3px 0 0; 
} 
.logininput{width: 90%; 
height: 30px; 
margin: 4px 1px 4px 1px; 
padding:0 10px; 
color: #404040; 
background: white; 
border:1px solid #0076a3; 
border-top-left-radius: 5px 5px; 
border-bottom-left-radius: 5px 5px; 
font-family: 'Lucida Grande', Tahoma, Verdana, sans-serif; 
font-size: 14px; 
} 
.logininput:focus, .logininput:focus {border-color: #7dc9e2; outline-color: #dceefc; outline-offset: 0;} 

.login p.submit {text-align: center;} 
.login-help 
{margin: 20px 0px; 
font-size: 11px; 
font-weight:bold; 
color: blue; 
text-align:center;} 
.login-help a{color: #515c64;text-decoration: none;} 
.login-help a:hover{text-decoration: underline;}:-moz-placeholder {color: #c9c9c9 !important;font-size: 13px;}::-webkit-input-placeholder {color: #ccc;font-size: 13px;} 
.loginsubmit{cursor:pointer;padding: 0 18px; 
height: 29px; 
font-size: 12px; 
font-weight: bold; 
color: #527881; 
text-shadow: 0 1px #e3f1f1; 
background: #cde5ef; 
border: 1px solid; 
border-color: #b4ccce #b3c0c8 #9eb9c2; 
border-radius: 16px; 
background-image: -webkit-linear-gradient(top, #edf5f8, #cde5ef); 
background-image: -moz-linear-gradient(top, #edf5f8, #cde5ef); 
background-image: -o-linear-gradient(top, #edf5f8, #cde5ef); 
background-image: linear-gradient(to bottom, #edf5f8, #cde5ef); 
} 

.loginsubmit:active {cursor:pointer; 
background: #cde5ef; 
border-color: #9eb9c2 #b3c0c8 #b4ccce; 
} 
+0

Вы хотите автоматически сфокусировать поле? –

+0

В чем же проблема? В быстрой скрипке я сделал http://jsfiddle.net/5Jc9k/, похоже, работает. – samuraiseoul

ответ

0

Я попробовал ваш код на IE, Mozilla и хром, и он работает нормально для меня .Когда я сфокусированная и выпущенная мышь в ваших полях ввода, поля ввода активны. Я не знал, с чем вы столкнулись.

+0

Я использую Mozilla, но всякий раз, когда я выпускаю ключ мыши, страница перезагружается, а поля не обрабатываются – arpymastro

Смежные вопросы