使3个div等距离。它们在div中，在div内。在视差网页上

Question

大家好，

我试图让3个div相互等距离。 DIV宽度由其中的IMG文件确定。

我已成功制作了一个80％宽度的容器div并居中。

然而，其中的DIV彼此等距（我可以看到），但不根据它们在中的div 来居中。

HTML：

<div class="slide" id="slide5" data-slide="5" data-stellar-background-ratio="0"> 

<div class="slide5_wrapper">

    <div class="slide5_recd2011">
        <a href="images/foto2011/_MG_0934.JPG" data-lightbox="RECD2011" title="Lezingen"><img src="images/RECD2011_thumbnail.png"></a>
        <a href="images/foto2011/_MG_0972.jpg" data-lightbox="RECD2011" title="Lunch"></a>
    </div>        

    <div class="slide5_recd2012">
        <a href="images/foto2011/_MG_0934.JPG" data-lightbox="RECD2012" title="Lezingen"><img src="images/RECD2011_thumbnail.png"></a>
    </div>

    <div class="slide5_recd2013">
        <a href="images/foto2011/_MG_0934.JPG" data-lightbox="RECD2013" title="Lezingen"><img src="images/RECD2011_thumbnail.png"></a>
    </div>

</div>

CSS：

.slide5_wrapper{
margin: 0 auto;
width:80%;
position: relative;
max-height:80%;
top:10%;
text-align:justify;

}



.slide5_recd2011, .slide5_recd2012, .slide5_recd2013 {
margin: 10px;
height:auto;
border-radius:15px;
vertical-align: top;
display:inline-block;
}

#slide5_wrapper:after {
content: '';
width:100%;
display:inline-block;
}

请原谅我使用术语（包装/包含者w / e）的可怕使用只是想让它起作用。

我不是一个真正的网站编码员，只是想学习，我有这个项目我已经接受了而不是太合格了（它是一个临时的非公司网站，不会成为我的业务，​​所以我'不要破坏工作领域或任何事情。）

提前致谢

Answer 1

以下是link的解释，这是工作sample。

#slide5_wrapper{
text-align: justify;
}

#slide5_wrapper:after{
content:'';
width:100%;
display:inline-block;
}

#slide5_wrapper div{
display: inline-block;
}

希望它有所帮助。

Answer 2

这是怎么回事：

.slide5_recd2012{
    width: 33%;
    float:left;
    box-sizing: border-box;
    padding: /*some padding you need */ 0;
}