本のリンク画像の周りをテキストで埋めたい〜
はてなで、ISBN:074756107:image と半角英字で書くと下のように本の写真とリンクを文中に埋め込める。 とっても素敵なんだけれど、続けて文を書いていくと、
ハリーポッター最新刊。イギリス版のChildren Version です。 子供向けなら、なんとか頑張って読めるような気がして買ってみました。しかし、他の本を読んでいて(図書館本なので返却期限が…)まだ読み始めていないんだ。 子供用なので、活字は大きめで、読みやすそう。 単語も簡単になっているのかなぁ。 日本語だと漢字にフリ仮名付いたりするけれど、イギリス版の大人用、子供用ってどう違うんでしょう?
↑ こういうふうに、文章が画像のいちばん下から ズズッと伸びていき、どうしても画像の横が ガラーン と空いてしまう。 なんか カッコ悪いし、無駄な空間が…。 どーやったら、文章を回り込ませて 画像の右側の空白を埋めるようにレイアウトできるのでしょうか? 誰か、教えてー。 教えてはてなダイアリー !! (呪文じゃ〜)
どういう風にしたいかというと、zeroset さんのページ( id:zeroset:20040801 )みたいに。 画像の右側にテキストが回りこんでいって、そして段落がもっと長い場合(またはブラウザのウインドウ幅を狭くした場合など)画像の下にまで自然にテキストが回りこむようになっている。 どうしたら、こういう風にできるんでしょうか? お願い、教えて〜。
追記:HTMLのTABLEタグを使って無理やり並べることは思いつくのですが、TABLEを使わないでやりたいのです。
できました〜
なんとか思ったようにできたみたいです。ありがとうございます。 結局、
div.section img{
float:left; margin: 0.6em; border:none
}
h3,div.section { clear:left; }
というのをCSSに加えました。
div.section img{---} で、テキスト内の画像を指定するというのが、分からなかったんです。 はてなのヘルプを何度も読んだのに〜。
ハリーポッター最新刊
買っちゃった。買っちゃった。でもまだ読んでない。まだ読んでない。 日本語版が発売される前に読み終えちゃおう(ちょと、ふふん)なんて思っていたら、もう8月じゃ〜。まだ読み始めてもいなかった。 米国版を買おうか、英国版を買おうか迷いましたが、せっかくだから原作をそのまま読むぞ!っという勢いで英国版をゲットしたんです。 しかーし、買ってから気付いたんですが、これは子供向けVersionだったんです! やっぱり大人向けとは英語の難易度が全然違うのだろうか。 ちょっとショックーー。 でも、これより難しかったら読めそうもないから、きっと正しい選択をしたんでしょうね。
ハリーポッターの映画も見にいかなくちゃー。 忙しい、忙しい。今夏休みだから、込んでるかなー、映画館。