CSS - 有某种保证金，但没有财产可以改变

Question

这个div占用了整个水平空间，没有留下后续div的空间，所以它们被强制到下一个可用的水平空间。

<div id="featured_positions_container">
    [insert_php]
        remove_filter ('the_content', 'wpautop');
        $args = array('category_name'=>'featured-positions','posts_per_page' => -1);
        $query = new WP_Query($args);
        while($query->have_posts()):
            $query->the_post();
            $div_image = wp_get_attachment_image_src(get_post_thumbnail_id(get_the_ID()),'full');
            echo '<div class="featured_positions_plates" style="background-image:url('.$div_image[0].')">';
            echo get_the_title();
            echo '</div>';
        endwhile;
    [/insert_php]
</div>

CSS

#featured_positions_container{
    width: 90%;
    height: 250px;
    overflow: scroll;
}
.featured_positions_plates{
    width: 200px;
    height: 200px;
    padding: 0px 40px;
    overflow: hidden;
    display: block;
}

Answer 1

没有边距，这是元素，因为显示属性是块。将其更改为内联块。

<强> Demo

<div id="featured_positions_container">
    <div class="featured_positions_plates">1</div>
    <div class="featured_positions_plates">2</div>
</div>

CSS

.featured_positions_plates{
    width: 200px;
    height: 200px;
    padding: 0px 40px;
    overflow: hidden;
    display: inline-block; // change this to inline-block
    background-repeat: no-repeat; 
}

如果在CSS检查器中向下滚动，您将看到边距为NULL