リスト横並びで画像を並べた時の隙間を消す

リスト横並びで画像を並べた時、display:inline;を指定して水平に並べた場合、要素と要素の間に隙間が生じます。
これは空白類文字といって、ソースコード内の改行は半角スペースくらいの空白に変換するそうです。

1. <li>タグを改行せず、一行に並べる

2. <li>タグの間にコメントタグを入れる

3. </li>の閉じタグを途中で区切る

4. display:inline;をやめて、float:left;で横並びにする

5. display:table-cell;で横並びにする

display:table-cell;はIEでは対応していない為、モダンブラウザとIEで記述を分けなければならない。

6. font-sizeで隙間を消す

横並びの要素を包括する要素にfont-size:0;を指定すれば、隙間は消えます。<li>を横並びにするなら、<ul>にfont-size:0;

WordPressの「メディアの追加」トラブル時の対処

すべてのプラグインを無効化し、同時にテーマをデフォルトのテーマに戻して再度試してみましょう。それで正常に動くなら一つずつ元に戻してみて、どれが問題を引き起こしているか絞り込むことができるはずです。 キャッシュが問題に関係している場合があります。フラウザのキャッシュを削除して再度試してみてください。また、WordPress のキャッシュプラグインを使用している場合はそれを停止し、キャッシュファイルをクリアして試してみましょう。 ログインしている場合とログインしていない場合で現象に違いが出るでしょうか。また、使用するブラウザを変えてみてはどうでしょうか。ブラウザに保存されている Cookie が関係している場合もあるので、それをクリアして再度試してみてください。

対処はたったひとつ wp-config.php に以下を追加。

define('CONCATENATE_SCRIPTS', false);

WordPress Codex日本語版によると

管理画面のスピードアップのため、JavaScript ファイルはすべてひとつの URL に連結されます。管理画面で JavaScript がうまく動作しない場合、この機能を以下のようにして無効化できます。