-3

所以我一直在使用这个网站（http://cee.cgreen.ca/index.php?page=designs）（这是一个原型），但引导程序似乎总是很不稳定。总是有一些钩子将产品抓成一个用于自己的行等。我似乎无法弄清楚。;-;

    // HTML
<div id="products">
    <div class="span4"> //twitter span
    <div class="product-grid"> //contained image
    <div class="product-grid-item">
    <div class="product-link" title="Pin this!">

    <img src="images/designs/shirt.png" class="product-photo">

    <div class="over-wrapper" style="opacity: 0; display: block;"></div>
    <div class="over-content" style="opacity: 0; display: block;"><br><br><br>

    <a href="link" data-pin-do="buttonPin" data-pin-config="none" target="_blank">
    <img src="images/pinthis.png" style="margin:auto;"></a> 

    </div></div></div></div></div>

/** CSS **/
#products {
    text-align: center;
    color: #999999;
    text-decoration: none;
    font: 12px "proxima-nova";
    margin-left:auto;
    margin-right:auto;
    max-width:100%;
}

.product-grid{
  color: #666666;
  margin:10px;
}

.generated-height .product-grid-item {
  width: 177px;
  position: absolute;

  bottom: 0;

  }

.product-grid img{
  display: block;
  margin: 0 auto;
  }

.product-grid a{
  text-decoration: none;
  display: block;
  color: #333333;

  }

.product-grid .product-link{
  display: block;
  position: relative;
  z-index: 1;
  text-decoration: none;
  margin: 0;
  min-height: 50px;
  /* for ie6: */
  width: 100%;
  }

.product-grid .product-link .over{

    position: Absolute;    
    top: 0;
    left: 0;
    display: none;
}

.product-photo{
  max-width: 100%;
}
.ie6 .product-grid{ overflow: hidden; }

.span4 {
  width: 300px;
}

.row-fluid .span4 {
  width: 31.91489%;
  *width: 31.8617%;
}
4

1 回答 1

0

对于产品部分，每行有 6 个 span4。

Spas 每行最多应添加 12 个，因此将其更改为每行 3 个 span4，并取消您的自定义 CSS 

.span4 {
 width: 300px;
}
于 2013-07-23T00:28:08.127 回答