我正在使用 Rails4 构建原型(prototype)。我做了以下 custom.css.scss :
// System wide CSS
html {
background-color: gray;
margin: 5px;
padding-left: 10px;
padding-top: 2px;
height: auto;
}
body {
margin: 10px;
border-radius: 15px;
padding: 10px;
height: auto;
}
img {
align: left;
border: 2px white;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.profile_image {
float: left;
padding-right: 10px;
}
.col1of3, .col2of3, .col3of3 {
width: auto;
float: left;
margin: 5px;
}
我的问题是列的显示方式。在这个 View 中很好，因为我不使用 columns : 
但是这个页面，我用的是columns body 元素似乎更短而 length 元素更大:
(来源:screensteps.me)
我知道问题与 View 相关。所以这是我的 edit.html.erb :
<h1>Προσθήκη Ασθενούς</h1>
<%= render 'form' %>
<%= link_to 'Πίσω', patients_path %>
这是我的 _form.html.erb :
<%= form_for(@patient) do |f| %>
<% if @patient.errors.any? %>
<div id="error_explanation">
<h2>Σφάλμα κατά την διαδικασία αποθήκευσης: </h2>
<ul>
<% @patient.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="col1of3">
<div class="fieldset">
<%= f.label "Όνομα" %><br>
<%= f.text_field :name %>
</div>
<div class="fieldset">
<%= f.label "Επώνυμο" %><br>
<%= f.text_field :surname %>
</div>
<div class="fieldset">
<%= f.label "Φύλο" %><br>
<%= f.select :gender, options_for_select(list_genders)%>
</div>
<div class="fieldset">
<%= f.label "Ημερομηνία Γεννήσεως" %><br>
<%= f.date_select :birthday, :start_year => 1920, :use_month_names => ['Ιανούριος', 'Φεβρουάριος', 'Μάρτιος', 'Απρίλιο', 'Μάιος', 'Ιούνιος', 'Ιούλιος', 'Αύγουστος', 'Σεπτέμβριος', 'Οκτώβριος', 'Νοέμβριος','Δεκέμβριος'] %>
</div>
<div class="fieldset">
<%= f.label "Εικόνα" %><br>
<%= f.text_field :image_url %>
</div>
<div class="fieldset">
<%= f.label "ΑΜΚΑ" %><br>
<%= f.text_field :social_security_number %>
</div>
</div>
<div class="col2of3">
<div class="fieldset">
<%= f.label "Οργανισμός Ασφάλισης" %><br>
<%= f.select :social_security_institution, options_for_select(list_greek_sso) %>
</div>
<div class="fieldset">
<%= f.label "Αρ Οργαν Ασφάλισης" %><br>
<%= f.text_field :social_security_institution_number %>
</div>
<div class="fieldset">
<%= f.label "ΑΦΜ" %><br>
<%= f.text_field :afm %>
</div>
<div class="fieldset">
<%= f.label "Τηλ οικίας" %><br>
<%= f.text_field :home_phone %>
</div>
<div class="fieldset">
<%= f.label "Τηλ εργασίας" %><br>
<%= f.text_field :work_phone %>
</div>
<div class="fieldset">
<%= f.label "Κινητό" %><br>
<%= f.text_field :mobile_phone %>
</div>
<div class="fieldset">
<%= f.label "Πατρώνυμο (του)" %><br>
<%= f.text_field :father_name %>
</div>
</div>
<div class="col3of3">
<div class="fieldset">
<%= f.label "Διεύθυνση Οικίας" %><br>
<%= f.text_field :home_address %>
</div>
<div class="fieldset">
<%= f.label "Πόλη" %><br>
<%= f.text_field :city %>
</div>
<div class="fieldset">
<%= f.label "Χώρα" %><br>
<%= f.text_field :country, :value => 'Ελλάδα' %>
</div>
<div class="fieldset">
<%= f.label "Ταχυδρομικός Κώδικας" %><br>
<%= f.text_field :postal_code %>
</div>
<div class="fieldset">
<%= f.label :email %><br>
<%= f.text_field :email %>
</div>
<div class="fieldset">
<%= f.label "Σημειώσεις" %><br>
<%= f.text_area :notes, cols: "50", rows: "8" %>
</div>
<div class="actions">
<%= f.submit "Υποβολή" %>
</div>
</div>
<% end %>
知道为什么 columns 的元素在 <body> 之外会表现得像吗？标签？
谢谢
最佳答案
我认为这是因为 float 属性。在 _form.html.erb 的最后，考虑在 <% end %> 之前插入以下内容-
<div style="clear: both;"/>
这样就清楚了吗？
关于html - 使用 twitter 的 bootstrap 和 Rails4 呈现列，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23504632/