Сделать поля ввода текста и их метки правильно

Question

Вот выдержка из довольно стандартной формы Rails:

  <p>
    <%= f.label :from_station %> <%= f.text_field :from_station %>
  </p>
  <p>
    <%= f.label :to_station %> <%= f.text_field :to_station %>
  </p>

По умолчанию это выглядит так:

альтернативный текст http://img412.imageshack.us/img412/127/picture6u.png

Это выглядит не очень хорошо, поскольку текстовые поля не совпадают. Какой самый простой способ сделать форму похожей на это:

альтернативный текст http://img193.imageshack.us/img193/746/picture7shk.png

Я пытался установить свойство стиля width на <label> s, но это свойство, похоже, ничего не делает.

Answer 1

Я думаю, что это больше вопрос CSS;

Метки по умолчанию не являются элементом уровня блока и поэтому не принимают ширину. Попробуйте установить этот CSS:

label{
  width: 4em;
  float: left;
  text-align: right;
  margin-right: 0.5em;
  display: block
}

Надеюсь, это поможет!

Answer 2

Вы можете использовать <table>, где каждая метка находится в столбце 1, а каждое текстовое поле - в столбце 2.