如何将内部缩略图放置在容器的相同位置，简单的html问题

我有一个关于HTML位置的简单问题 在下面的代码中，我在这个div中有一个包装器div>容器 我还有两个div名字是side_bar_wrap和left_wrap在left_wrap div我有 4个缩略图div的名称与缩略图相同我的问题是如何将这4个缩略图div与左右之间的空格对齐，但在该组的第一个和最后一个div上不对齐

下面是我的代码，请帮助我

>>>>>>>

>>>>>>>

---

您可以使用css为您提供的第一个子项和最后一个子项

基本上，第一个子级允许您对第一个div进行样式更改，最后一个子级允许您对最后一个div进行更改

比如说：

.thumnails:第一个孩子{
/*一边没有空间*/
左边距：0px；
}
thumnails先生：最后一个孩子{
/*一边没有空间*/
右边距：0px；
}

使用jsfiddle.net创建小提琴。这将有助于更容易地理解你的问题。

.container 
{
    width:100%;
    max-width:1170px;
    margin:0 auto;
}

* 
{
    margin:0;   
    padding:0;
}

.side_bar_wrap
{
    width:29%;     
    height:300px;
    background:#148b23;
    margin:0 10px 0 0;
    float:left;
}

.left_wrap 
{
    width:70%;
    float:right;
}


.thumbnails{
width: 22%;
margin: 0 11px;

position: relative;
overflow: hidden;
    height:300px;
    border:1px solid #cfcfcf;
    float:left;
}

.inner_task 
{

}


.clear
{
    clear:both;
}

<div class="container">


        <div style="width:29%; float:left; height:400px; background:gray; margin:40px 11px 40px 0;"></div>

        <div style="width:70%;float:left; height:400px; background:gray; margin:40px 0;"></div>

        <div class="side_bar_wrap"></div>
        <div class="left_wrap">
            <div class="thumbnails">
                <div class="inner_thumb">
                    <div style="width:100%; height:200px; background:#efefef;"></div>
            </div>
            </div>

            <div class="thumbnails">
                <div class="inner_thumb">
                    <div style="width:100%; height:200px; background:#efefef;"></div>
            </div>
            </div>

            <div class="thumbnails">
                <div class="inner_thumb">
                    <div style="width:100%; height:200px; background:#efefef;"></div>
            </div>
            </div>

            <div class="thumbnails">
                <div class="inner_thumb">
                    <div style="width:100%; height:200px; background:#efefef;"></div>
            </div>
            </div>

        </div>

        <div style="width:100%; float:left; height:400px; background:gray; margin:40px 0;"></div>
    </div>