ボックスレイアウト

ボックスを均等に配置（横並び）

ボックスを横並びで均等に配置する方法です。
ボックス間の微調整はmarginで行うと効果的です。

親要素 {display:flex; justify-content:space-between; align-items:center;}
親要素 img {margin:？px;}

ボックスを均等に配置（折返し）

ボックスを均等に配置し、ページ内に収まらない分は折り返させる方法です。
ボックス間の微調整はmarginで行うと効果的です。

親要素 {display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap;}
親要素 img {margin:？px;}

その他のボックスレイアウト

ボックスからはみ出る時の対処法

ボックスからはみ出る時の対処法にはbox-sizingが効果的です。
box-sizingを指定するとボックスにpaddingとborderのサイズも含めて計算するようになるので、うまく使えばこうした問題に対処できる場合があります。
CSS3リファレンス（box-sizing）

要素 {box-sizing:border-box;}

ボックススペースの非表示方法

広告などをユーザーが非表示にした際に、不要なボックススペースを自動的に非表示にする方法です。
これにはdisplay:inlineを使っても可能ですが、ボックスのサイズにautoを指定すると簡単に実現できます。

要素 {width:auto; height:auto;}