- 2009年5月 9日 11:55
- その他
さくらもちさんからの疑問点です。
みなさんも読んでください!
ひとつの記事の中に、複数の写真を掲載したとき、直前の写真の右側(または左側)に、次の写真が回り込んでしまうことがあります。
▼こういうふうに▼
↓直前の写真
文章文章文章文章文章、文章文章文章文章文章。
↓回り込んだ写真
文章文章文章文章文章、文章文章文章文章文章。
これは、写真を入力した際に、「左寄せ」または「右寄せ」を指定すると、それ以降の記事や写真にも、この設定が有効になってしまうためです。
直前の写真に対する文章の行が、その写真の高さよりも多い場合は発生しません。
(実は発生してますが、見た目ではわかりません)
では、その解消方法を書きます。
■解消方法
1.WEBのルールを守る方法(推奨)
写真を入力したときに、その部分に
<form mt:asset-id="112" class="mt-enclosure mt-enclosure-image" style="display: inline;">(以下省略)
という文字列(タグといいます)が入りますよね。
このタグに下記の赤文字部分を追記するだけで解消されます。
<form mt:asset-id="112" class="mt-enclosure mt-enclosure-image clear" style="display: inline;">(以下省略)
class="mt-enclosure mt-enclosure-image
の末尾に、 clear(半角スペースとclear)を追記してください。
これにより、直前の「左寄せ」「右寄せ」が解除されます。
※注意
class="mt-enclosure mt-enclosure-image" の末尾に追記しますが、末尾にある「 " 」の外に追記してはいけません。 その内側に追記します。
○ class="mt-enclosure mt-enclosure-image clear"
× class="mt-enclosure mt-enclosure-image" clear
慌てんぼうの自覚がある人は気をつけてください(笑)
2.改行を入れる方法
「直前の写真に対する文章の行が、その写真の高さよりも多い場合は発生しません。」と前述しました。
それを利用して、写真のタグ以降に改行をいくつも入れて、写真の左右に次の写真を回り込ませない方法です。
そこに何もないから写真が回り込んでくるわけで、そこに改行を入れてしまえば回り込めません。
ただし、この方法はWEBのルールに則ってないので、プロの目からは推奨されません。
※改行によるレイアウト調整は、WEBの国際基準に反しているからです。
以上です。
こういう小さなことでも、「あれっ?」と思ったらどんどん聞いてくださいね!