2018floatを使ってコンテンツを並べる際に、最後の要素だけ余白をつけない方法のいくつかをご紹介します。CSSを使う全体幅のmarginで調整まず要素と要素の間の余白(A)を決め、全体幅(B)から引いた値(C)を、要素の数(D)で割ります。(A)=10px、(D)=3、(B)=320pxの場合、320-10×2=300px。この値を(D)で割ると1つの要素幅が100pxとなります。これをfloatで回り込ませて、余白10pxを指定すると、(100px+10px)×3=330pxとなり、全体幅から10pxはみ出てしまいます。そこで、親要素のulにmargin-right:-10pxを指定するのがポイントとなります。10px;}last-childを使用css3ではlast-childというスタイルがあり、これは疑似クラスの一種でリストの最後にだけスタイルを指定することができる。最後の要素にしか適用されないため、1行毎に設計する必要がある。現時点でIE8等対応していないブラウザもあるため、推奨環境に応じて対策が必要です。“jqueryを使うjqueyにも各親要素内のすべての最後の子要素を選択するセレクターが用意されています。覚えてしまえば簡単ですので、ぜひこちらも利用してみましょう。