用CSS3 box-sizing 属性实现两个并排的容器，如果想让容器中间有间隔该如何实现

问题描述

"<style>.container{ margin: 10px 20px; height: auto; overflow: hidden;}.box{ box-sizing:border-box; -moz-box-sizing:border-box; /* Firefox / -webkit-box-sizing:border-box; / Safari */ width:50%; float: left; height: 80px; margin-bottom: 10px; background: #fff; border-top: 5px solid #004389; text-align: center;}</style>

<p class='container'> <p class='box'><a href='https://www.haobala.com/wenda/6095.html' class='post'>产品经理</a><span>广州</span><span class='salary'>10k-15k</span> </p> <p class='box'><a href='https://www.haobala.com/wenda/6095.html' class='post'>产品经理</a><span>广州</span><span class='salary'>10k-15k</span> </p></p>

``想实现两个并排的容器中有一定的间隔，并且浏览器宽度改变时，间隔宽度不变

问题解答

设置下margin值就行了，不过宽度需要稍微调整下

。。。。。。。。。。。

margin外边框补白。

简单的设置透明 border或者直接再套一层用什么都可以了

如果你想在整体的布局上面达到统一的间距效果，建议你才用css3的弹性盒子布局(box-flex)