0

我正在使用 Ruby on Rails 3.2 构建一个在线商店，其中包括一个“do”循环，用于从数据库中提取产品详细信息并将结果包装在一个 Div 中。问题是当填充多个产品时，包装每个产品信息的 Div 没有水平对齐。我目前将 Div 设置为向左浮动，这将它们水平放置在彼此相邻的位置，但它们没有正确排列（右侧的每个 div 的位置都比它前面的那个低一点。

我在下面包含了 html 和 CSS 代码。对此的任何帮助将不胜感激

HTML 代码

<% @products.each do |product| %>  

<div class="Primary span 3">
<p id="offer-title"> <%= product.title %> </p>

<%= image_tag(product.image_url, :alt =>product.title, :width =>90, :height=>180)%>
        <hr />
        <div id="promo-header">
         <dl id="tier">
            <dt >Tier</dt>
            <dd class="tier-details tier1-style">1</dd>
            <dd class="tier-details tier2-style">2</dd>
            <dd class="tier-details tier3-style">3</dd>
          </dl>
          <dl id="save">
            <dt >Save</dt>
            <dd class="tier-details tier1-style">$0.50</dd>
           <dd class="tier-details tier2-style">$1.00</dd>
           <dd class="tier-details tier3-style">$1.50</dd>
          </dl>
         <dl id="units">
            <dt >Units</dt>
            <dd class="tier-details tier1-style">1000</dd>
            <dd class="tier-details tier2-style">3000</dd>
            <dd class="tier-details tier3-style">5000</dd>
          </dl>

        </div>

CSS 代码

.Primary {
padding-right: 10px;
float:left;
position:relative; left:185px; 
margin-right: 20px;
width: 265px;
display: block;
height: 320px;
background: white;
border: 1px solid;

}

我已经为此苦苦挣扎了 3 天，希望能提供任何帮助。

4

1 回答 1

0

这是一个简单的错误，文本从 div 外的段落溢出并将框向下推。一旦我纠正他们都排得很完美。

于 2013-07-18T18:52:13.257 回答