Вёрстка формы регистрации - HTML и CSS

Che Guevara · 13.10.2010, 08:47

Друзья! Помогите разобраться с принципом верстки формы регистрации на сайте. Ситуация такова: Есть сайт (хтмл+пхп). Каркас состоит из таблицы: верхней ячейки - баннера, левой ячейки - меню и центральной ячейки - место для помещения формы для регистрации. При попытке поместить

Код HTML:

<form>
Имя: <input type=text name=login><br>
Фамилия: <input type=text name=login><br>
</form>

итд, соответственно всё получается криво. Попробовал поместить енто всё в таблицу 1*1 - не работает <form></form>. Как быть? Как сделать так чтобы надписи Имя и Фамилия были выровнены по левому краю, а их соответствующие поля формы выровнены по своей левой стороне?

ЗЫ: Если можно маленький практический примерчик, please...

KPEATuBHO · 13.10.2010, 11:43

Я бы сделал так:

<form>
<table width="100%">
<tr>
<td>
Имя:</td><td> <input type=text name=login></td></tr>
<tr>
<td>
Фамилия: </td> <td><input type=text name=login></td></tr>
</table>
</form>

MrJenika · 13.10.2010, 17:21

а можно заключить всё в свой стиль например так:

Код:

<form class="my_form">
Имя: 
<input type=text name=login><br>
Фамилия: 
<input type=text name=login><br>
</form>

и уже в css культурно написать

.my_form
{
align:left; // или text-align:left; что больше понравится
}

MrJenika · 13.10.2010, 17:21

а можно заключить всё в свой стиль например так:

Код:

<form class="my_form">
Имя: 
<input type=text name=login><br>
Фамилия: 
<input type=text name=login><br>
</form>

и уже в css культурно написать

.my_form
{
align:left; // или text-align:left; что больше понравится
}

KPEATuBHO · 13.10.2010, 18:00

2 MrJenika

а их поля ввода выровнены по своей левой стороне?)

MrJenika · 13.10.2010, 18:26

2 KPEATuBHO
я показал пример, писать за кого-то весь код я не нанимался.
Можно просто сделать всё на новой строке.
И да, я сначала не понял про СВОЯ ЛЕВАЯ СТОРОНА.
За что прошу прощения.

SyncAllow · 09.04.2012, 20:34

<html>
<head>
<title>Регистрация на сайте</title>
</head>

<body>
<h2>Регистрация на сайте</h2>

<form name="regform" method="post">

<table width="100%">

<tr>

<td>Логин:<sup>*</sup></td>

<td><input type='text' name='login' /></td>

</tr>

<tr>

<td>Пароль:<sup>*</sup></td><br />

<td><input type='password' name='pass1' /></td></br>

</tr>

<tr>

<td>Повторите пароль:<sup>*</sup>

<td><input type='password' name='pass2' />

</tr>

<tr>

<td><select size="1" name="country">

<option value="Russia">Россия</option>

<option value="Ukraine">Украина</option>

</td>

</tr>

<tr>

<td colspan=2>Поля,помеченые звездочкой (<sup>*</sup>),являются обязательными.</td>

</tr>

<tr>

<td><input type="submit" value="Зарегестрировать"></td>

</tr>

</table>

</form>

</body>
</html>

13.10.2010, 08:47	#1
Che Guevara Пользователь Регистрация: 27.07.2010 Сообщений: 91	Вёрстка формы регистрации Друзья! Помогите разобраться с принципом верстки формы регистрации на сайте. Ситуация такова: Есть сайт (хтмл+пхп). Каркас состоит из таблицы: верхней ячейки - баннера, левой ячейки - меню и центральной ячейки - место для помещения формы для регистрации. При попытке поместить Код HTML: <form> Имя: <input type=text name=login><br> Фамилия: <input type=text name=login><br> </form> итд, соответственно всё получается криво. Попробовал поместить енто всё в таблицу 1*1 - не работает <form></form>. Как быть? Как сделать так чтобы надписи Имя и Фамилия были выровнены по левому краю, а их соответствующие поля формы выровнены по своей левой стороне? ЗЫ: Если можно маленький практический примерчик, please...

13.10.2010, 11:43	#2
KPEATuBHO Форумчанин Регистрация: 03.09.2010 Сообщений: 197	Я бы сделал так: <form> <table width="100%"> <tr> <td> Имя:</td><td> <input type=text name=login></td></tr> <tr> <td> Фамилия: </td> <td><input type=text name=login></td></tr> </table> </form> быстрый хостинг. недорогие домены.

13.10.2010, 17:21	#3
MrJenika Форумчанин Регистрация: 07.09.2009 Сообщений: 361	а можно заключить всё в свой стиль например так: Код: `<form class="my_form"> Имя: <input type=text name=login><br> Фамилия: <input type=text name=login><br> </form>` и уже в css культурно написать .my_form { align:left; // или text-align:left; что больше понравится } webinmd.com

13.10.2010, 17:21	#4
MrJenika Форумчанин Регистрация: 07.09.2009 Сообщений: 361	а можно заключить всё в свой стиль например так: Код: `<form class="my_form"> Имя: <input type=text name=login><br> Фамилия: <input type=text name=login><br> </form>` и уже в css культурно написать .my_form { align:left; // или text-align:left; что больше понравится } webinmd.com

13.10.2010, 18:00	#5
KPEATuBHO Форумчанин Регистрация: 03.09.2010 Сообщений: 197	2 MrJenika а их поля ввода выровнены по своей левой стороне?) быстрый хостинг. недорогие домены.

13.10.2010, 18:26	#6
MrJenika Форумчанин Регистрация: 07.09.2009 Сообщений: 361	2 KPEATuBHO я показал пример, писать за кого-то весь код я не нанимался. Можно просто сделать всё на новой строке. И да, я сначала не понял про СВОЯ ЛЕВАЯ СТОРОНА. За что прошу прощения. webinmd.com

09.04.2012, 20:34	#7
SyncAllow Новичок Джуниор Регистрация: 09.04.2012 Сообщений: 1	html простая форма регистрации <html> <head> <title>Регистрация на сайте</title> </head> <body> <h2>Регистрация на сайте</h2> <form name="regform" method="post"> <table width="100%"> <tr> <td>Логин:<sup></sup></td> <td><input type='text' name='login' /></td> </tr> <tr> <td>Пароль:<sup></sup></td><br /> <td><input type='password' name='pass1' /></td></br> </tr> <tr> <td>Повторите пароль:<sup></sup> <td><input type='password' name='pass2' /> </tr> <tr> <td><select size="1" name="country"> <option value="Russia">Россия</option> <option value="Ukraine">Украина</option> </td> </tr> <tr> <td colspan=2>Поля,помеченые звездочкой (<sup></sup>),являются обязательными.</td> </tr> <tr> <td><input type="submit" value="Зарегестрировать"></td> </tr> </table> </form> </body> </html>

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Правильная вёрстка	STIGMATED	HTML и CSS	0	17.09.2010 21:45
Wordpress. Вёрстка.	_alexx_	WordPress и другие CMS	0	18.05.2009 20:26
Табличная вёрстка	psywalker	HTML и CSS	0	23.06.2008 20:57
Вёрстка	psywalker	HTML и CSS	2	18.06.2008 15:01