問題描述

"<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='http://www.cgvv.com.cn/wenda/6095.html' class='post'>產品經理</a><span>廣州</span><span class='salary'>10k-15k</span> </p> <p class='box'><a href='http://www.cgvv.com.cn/wenda/6095.html' class='post'>產品經理</a><span>廣州</span><span class='salary'>10k-15k</span> </p></p>

``想實現兩個并排的容器中有一定的間隔，并且瀏覽器寬度改變時，間隔寬度不變

問題解答

設置下margin值就行了，不過寬度需要稍微調整下

。。。。。。。。。。。

margin外邊框補白。

簡單的設置透明 border或者直接再套一層用什么都可以了

如果你想在整體的布局上面達到統一的間距效果，建議你才用css3的彈性盒子布局(box-flex)