Горизонтальная форма

HTML разметка горизонтальной формы для плагина CF7 бутстрапа:

<div class="form-horizontal">
<div class="form-group">
<label class="control-label col-md-3">Ваше имя</label><div class="col-md-9">[text* your-name class:form-control]</div></div>
<div class="form-group"><label class="control-label col-md-3">Ваш e-mail</label><div class="col-md-9">[email* your-email class:form-control]</div></div>
<div class="form-group"><label class="control-label col-md-3">Тема</label><div class="col-md-9">[text your-subject class:form-control]</div></div>
<div class="form-group"><label class="control-label col-md-3">Сообщение</label><div class="col-md-9">[textarea your-message x5 class:form-control]</div></div>
<div class="form-group"><div class="col-md-offset-3 col-md-9">[submit class:btn class:btn-primary "Отправить"]</div></div>
</div>

Немного пояснений — класс «form-horizontal» добавляем не к форме, как указано на сайте бутстрапа, а к блоку. Далее все как в html разметке bootstrap 3, только для плагина CF7. Результат — на скрине:

Форма без надписей, с плейсхолдерами

В ней мы не будем использовать form-horizontal или каких либо других классов формы, а разметку сделаем с помощью сетки бутстрапа. Исходный код:

<div class="row">
<div class="col-md-6 form-group"><label class="sr-only">Ваше имя</label>[text* your-name class:form-control placeholder "Ваше имя"]</div>
<div class="col-md-6 form-group"><label class="sr-only">Ваш e-mail</label>[email* your-email class:form-control placeholder "Ваш e-mail"]</div>
</div>
<div class="form-group"><label class="sr-only">Тема</label>[text your-subject class:form-control placeholder "Тема"]</div>
<div class="form-group"><label class="sr-only">Сообщение</label>[textarea your-message x5 class:form-control placeholder "Сообщение"]</div>
<div class="form-group">[submit class:btn class:btn-primary "Отправить"]</div>

В результате получим вот такую симпатичную формочку:

---