imgタグを使用して表示した画像の下には余分な余白ができてしまいます。
これは画像の下端がテキストのベースラインに合わせられることが原因です。

アルファベット小文字のgやy等で、ベースラインよりも下にはみ出す部分のことをディセンダー（descender）といいます。
このディセンダーは文字だけではなくimg要素にも適用されるので、画像の下に余白ができてしまいます。

ディセンダーはimg要素にvertical-align: text-bottom;
もしくはvertical-align: middle;を指定することで削除できます。

img
{
    vertical-align: text-bottom;
    vertical-align: middle;
}

ちなみに、img要素にmiddleを指定すると、画像の中心を小文字の「x」の中心に揃えることになる。

挿入した画像のリンクにLightbox等の属性を追加したいとき、
その都度、手作業で挿入されたタグを編集してもいいですが
自動でできれば、それに越したことはないですよね？

そんなとき、フィルターフックに自作関数をフックして挿入されるタグをカスタマイズします。
※挿入されるときに適用されるので、それまでの投稿には反映されません。

Lightboxで必要なrel属性を追加します。以下のコードをfunctions.phpに追加。

function my_image_tag( $html, $id ) {
    $html = preg_replace('/a href=/', 'a rel="lightbox['.$id.']" href=', $html); 
    return $html;
}
add_filter( 'image_send_to_editor', 'my_image_tag', 10, 2 );

続きを読む…»

WORDPRESSでは、既存のテーマを元に子テーマを作成することができます。
最低限必要なのは、テーマの基本となるスタイルシートファイル（style.css）のみです。
あとは、スクリーンショットがあれば尚可。

まず、themesディレクトリに子テーマ用のディレクトリを作成します。
ここでは親テーマの名前を「parent」、子テーマの名前を「child」とします。

wp-content/themes/child

style.cssを作成します。

/*
    Theme Name: child
    Template: parent
*/

@charset "utf-8";
@import url("../parent/style.css");

@import url();にて親テーマのCSSファイルを相対パスを指定して読み込みます。
そして、このファイルにスタイルを記述していけば親テーマのスタイルよりもこちらが優先されます。
続きを読む…»

文章の改行方法を指定したいとき、スタイルシートのword-breakプロパティを設定します。
特にURLやソースコードなど、途中で改行されずにボックスからはみ出てしまうことがあります。
※これまではIEのみの対応だったようですが、CSS3では標準採用されているようです。

div.sample
{
    word-break: break-all;
}

続きを読む…»

単純にナビを起動するなら、以下のようにリンクを貼るだけです。
但し、経路を表示するまでに３タッチ必要です。

※引数に与える座標は世界測地系(WGS84)です。

<a href="http://maps.google.com/maps?daddr=35.65860811863414,139.7455318066551">ナビ起動</a>