Стилизация тега формы в некоторых случаях может быть полезна. Просто убедитесь, что тег формы действует так, как если бы это был слой. Не нужно делать <div id="myform"><form></form></div>
Просто сформируйте {display:block;}, и он будет действовать так, как будто это div.
О семантике и, поскольку вы просите сделать это правильно: распространенная ошибка - использовать div для меток, а затем терять удобство использования.
Используйте HTML для того, для чего он предназначен! В качестве примера, вот как будет выглядеть базовая форма в HTML в соответствии со стандартом.
<form method="post" action="https://www.someurl.com/formHandler.php">
<fieldset>
<legend>Personal info</legend>
<label for="name">Name:</label>
<input type="text" id="name" class="text" />
<label for="email">Email</label>
<input type="text" id="email" class="text" />
</fieldset>
<fieldset>
<legend>Optional</legend>
<label for="info">Comments?</label>
<textarea id="info"></textarea>
<input type="submit" value="submit" class="submit" />
</fieldset>
</form>
Подобное использование HTML позволяет пользователю щелкать метки или нажимать вкладку, чтобы сфокусироваться на нужном поле.
Стилизация может быть сложной, однако вам не нужно много кода, если вы знаете, что делаете.
form { display:block; background-color: #9e9e9e; padding: 20px; width: 540px; /*200 + 300 + (20 * 2)*/ }
legend { font-weight: bold; }
label { display: inline-block; width: 200px; float: left; clear: left; }
input.text { display: block; width: 300px; float: left; }
input.submit { margin:20px 0 0 200px; width: auto; }
пример: https://jsfiddle.net/tive/BB85w/
23.07.2012