html - 排列文字栏位

如何排列文本字段使它们看起来更整洁？现在我有：

<div id="content">
    <h2>Change password</h2>
    <% form_tag({:action => "change_password"}, :method => "post") do %>
    <%= @error %>

    <div class="form_row">
        <label for="current_password">Current password:</label>
        <%= password_field_tag 'current_password', "", :size => 15 %>
    </div>

    <div class="form_row">
        <label for="new_password">New password:</label>
        <%= password_field_tag 'new_password', "", :size => 15 %>
    </div>

    <div class="form_row">
        <label for="repeat_new_password">Repeat new password:</label>
        <%= password_field_tag 'repeat_new_password', "", :size => 15 %>
    </div>

    <%= submit_tag "Set new password", :class => "submit" %>
    <% end %>
</div>

最佳答案

在label元素中放置一个宽度。

<form action="">
    <label style='float: left; display: block; width: 100px;'>Hello</label><input type="text" size="3"><br />
    <label style='float: left; display: block; width: 100px;'>Long World</label><input type="text" size="3"><br />
    <label style='float: left; display: block; width: 100px;'>How are you?</label><input type="text" size="3"><br />
</form>

关于html - 排列文字栏位，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/887769/