Форма входа в 1 ряд

[Евгений_SB]

Ребят Здравствуйте помогите пожалуйста, верстаю макет столкнулся с такой проблемой 

есть форма входа в шапке мне нужно расположить её в 1 ряд пока она так 

 

в psd макете вот так 

 

 

код html 

<form name="input" method="post" action="#">        		<p>Логин</p>        		<input name="login" type="text" class="logPas">        		<p>Пароль</p>        		<input name="password" type="password" class="logPas">        		<br>        		<input name="submit" type="submit">

в коде css пока написал так 

}input:focus {    outline:none;}.logPas {	width: 90px;	border-radius: 4px;	border: 1px #98a7b5 solid;}

поскажите как сделать её в одну строку float:left  работает не так как нужно , пока гуглил некоторые советовали обернуть каждый тег формы в div . но насколько я знаю всовывать дивы туда где можно обойтись css не есть хорошо ,может я что то упустил ,подскажите как решить,заранее спасибо)))

Edited April 11, 2014 by Евгений_SB

[Kublyakov]

Я бы сделал как-то так: http://jsfiddle.net/kublyakov/jg6HZ/ - лучше дивы, чем <br>, ИМХО.

Но я только учусь, не уверен что мой способ правильный.

[Светлана Г.]

Замечу, что вместо <p>Логин</p> корректнее использовать <label>, связывающий label и input через for и id:

http://htmlbook.ru/html/label.

float:left  работает не так как нужно

А почему не так работают?  Видимо, места не хватает. Можно использовать и <div>, задав свойство display:inline-block; Это совершенно допустимо.

[Евгений_SB]

Замечу, что вместо <p>Логин</p> корректнее использовать <label>, связывающий label и input через for и id:

http://htmlbook.ru/html/label.

 

 

float:left  работает не так как нужно

А почему не так работают?  Видимо, места не хватает. Можно использовать и <div>, задав свойство display:inline-block; Это совершенно допустимо.

 

да спасибо воспользовался вашим советом помогло)))

Edited April 16, 2014 by Евгений_SB