ボックスを横並びにしたときの最端の余白をなんとかする

画像と画像の間に25pxの余白を持たせた形で横並び(float:left)。普通なら3つめの画像の右余白の25pxが邪魔してカラム落ち。それを防ぐために.rightとかclass振りますが、メンドクサイので無理やりなんとかしてみましょー。(動作未確認。)

html

<div id="productList">

	<ul>
		<li><img src="hoge.jpg" alt="画像" /></li>
		<li><img src="hoge.jpg" alt="画像" /></li>
		<li><img src="hoge.jpg" alt="画像" /></li>
		<li><img src="hoge.jpg" alt="画像" /></li>
	</ul>

<!-- end #productList --></div>

css

#productList{
	width:800px;
}
#productList img{
	width:250px;
}
#productList ul{
	list-style:none;
	margin:0 -25px 0 0;
	padding:0;
	zoom:1; /* ie */
}
#productList ul li{
	float:left;
	margin:0 25px 0 0;
	padding:0 0 15px 0;
}

/*----------------------------------------
clearfix
----------------------------------------*/
#productList:after{
	content:".";
	height:0;
	clear:both;
	display:block;
	visibility:hidden;
	font-size:0;
	line-height:0;
}

#productList{
	display:inline-block;
}

/* exlude MacIE5 \*/
* html #productList{
	height:1%;
}

#productList{
	display:block;
}
/* end MacIE5 */

MW WP Form

MW WP Form はショートコードベースのフォームプラグインです。多くの機能を持っており、例えば、多くのバリデーションルール、問い合わせデータの保存、そしてグラフ機能集計などを使用することができます。

さらに詳しく
Habakiri

Habakiri

Bootstrap ベースのシンプルな WordPress テーマ。レスポンシブ、多くのカスタマイズ機能。圧縮された CSS・JS を使用する高速化対策。Microformats 対応。Sass、クラスベースの functions.php。

さらに詳しく
basis-stylus

Basis

軽量なレスポンシブ Stylus/CSS フレームワーク。Flexbox ベースのグリッドシステム、疎結合なコンポーネント、バーティカルリズム。

さらに詳しく