CSS防止div移动顶部

时间:2014-09-20 14:20:39

标签: html css css-selectors

问题在于:

`http://jsfiddle.net/5gju85un/3/`

我想预备div#3从向上移动而保持向左移动。 我怎么能这样做?

修改

这些div是在原始代码中循环创建的,所以我不能只生成两个父div。

修改

插入完整代码(我自己制作模板以在wordpress中使用)

HTML / PHP

if ( $loop->have_posts() ) {
        while ( $loop->have_posts() ) : $loop->the_post()?>
                        <div class="produkt ramka">
                            <div class="produkt_obraz">
                                <?php woocommerce_show_product_images();?>
                            </div>
                            <div class="produkt_nazwa">
                                <h3 class="produkt_litery"><?php woocommerce_template_single_title();?></h3>
                            </div>
                            <div class="produkt_cena">
                                <?php woocommerce_template_single_price();?>
                            </div>
                            <div class="produkt_line">
                            </div>
                            <div class="produkt_opis">
                                <?php the_content();?>
                            </div>
                            <div class="produkt_koszyk">
                                <?php woocommerce_template_loop_add_to_cart()?>
                            </div>
                        </div>    

        <?php endwhile;
    }

CSS

.produkt
{
    display: inline-block;
    height:auto;
    min-height:120px;
    width:49.50%;
    margin-bottom:5px;
    background-color:#252525;
    overflow:hidden;
}
.produkt:nth-child(2n+1)
{
    float:left;
}
.produkt:nth-child(2n)
{
    float:right;
}

正如您所看到的,我在jsfiddle中完成的代码基于此

1 个答案:

答案 0 :(得分:1)

demo

<div class="divs st">div1</div>
<div class="divs nd">div2</div>
<div style="clear:both"></div>
<div class="divs rd">div3</div>
<div class="divs th">div4</div>
<div class="divs">div5</div>
<div class="divs">div6</div>