如何制作更大的高度胶带？

Question

我有这个网站：

link

在这个页面上你会找到你的产品盒......我希望它们的价格高出10％。

我画了一张照片来理解我的意思。

http://i57.tinypic.com/11rvjhj.jpg

<ul class="products-grid one_column_4">
    <li class="item">
        <div class="regular">//some code HTML</div>
        <div class="hover">//some code HTML</div>
    </li>
    <li class="item"></li>
    <li class="item"></li>
    <li class="item"></li>
    <li class="item"></li>
    <li class="item"></li>
    <li class="item"></li>
    <li class="item"></li>
    <li class="item"></li>
</ul>

CODE CSS：

.products-grid li.item { 
    float:left; 
    width:252px; 
    padding:0;
    margin:0 15px 30px; 
    position:relative;
    background:#fff; 
    border:9px solid #fff; 
    border-radius:3px;
    -webkit-border-radius:3px; 
    -moz-border-radius:3px;
    -webkit-box-shadow:0px 0px 6px 0px rgba(0, 0, 0, 0.15);
    -moz-box-shadow:0px 0px 6px 0px rgba(0, 0, 0, 0.15);
    box-shadow:0px 0px 6px 0px rgba(0, 0, 0, 0.15);
    height:350px;    //I add this code
}

我尝试了上面的代码，但看看它们看起来如何......不太好。

http://i57.tinypic.com/33zck8j.png

你能否告诉我如何在不影响其他内容的情况下让盒子更高？

Answer 1

我的解决方案是在项目周围使用div并将项目的高度设置为100％。 您可以使用视图高度单位（请参阅此处：http://www.w3schools.com/cssref/css_units.asp）

vh或vw参数强制项目的高度或宽度。 1vh对应于屏幕视图的1％。但是，如果更改窗口大小，则会更改项目的大小，直到达到vmin参数。