CSSで画像を下に配置

CSSで画像を枠内の右下に配置したいのですが、どのように表記したらよいでしょうか？
よろしくお願いいたします。

No.1 回答者： noname#158634 回答日時： 2011/12/27 14:52

position

この回答への補足

<div>～</div>の間で設定したいのですが。
どうでしょうか。

補足日時：2011/12/27 15:04

No.2 回答者： noname#158634 回答日時： 2011/12/27 15:27

＞<div>～</div>の間で設定したいのですが。

だからpositionだと言っていますよね。<div>とか関係ないから。
少しは考えるか試すかしてください。
https://www.google.com/search?q=css+%E7%94%BB%E5 …

この回答への補足

同じページをもう調べて試してみました。
テキストを画像のように回り込んで表示したいのです。

補足日時：2011/12/27 15:34

No.3 ベストアンサー 回答者： ORUKA1951 回答日時： 2011/12/27 15:46

　画像などを、それが含まれる当該親ブロック内でfloatさせ、かつ右下におきたいのでしょうが、それは不可能です。

　floatプロパティでは、最上位に位置することが定められています。
「A floating box must be placed as high as possible. ( http://www.w3.org/TR/CSS2/visuren.html#float-pos … )」

　通常文中の挿絵に関しては、次のようにマークアップされていると思います。
[HTML5]
<section>
　<hn>見出し</hn><!-- nは1～6 sectionには見出しがあるべき -->
　<p>段落</p>
　<p>段落</p>
　<figure><img></figure>
　<p>段落</p>
　<p>段落</p>
</section>
<section>
　<hn>見出し</hn><!-- nは1～6 -->
　<p>段落</p>
　<p>段落</p>
・・・以下省略
[HTML4]だと
<div class="section">
　<hn>見出し</hn><!-- nは1～6 -->
　<p>段落</p>
　<p>段落</p>
　<div class="figure"><img></div>
　<p>段落</p>
　<p>段落</p>
</div>
<div class="section">
　<hn>見出し</hn><!-- nは1～6 -->
　<p>段落</p>
　<p>段落</p>
・・・以下省略

この場合、
figure{float:right;width*300px;}
section{clear:right;}
もしくは
div.figure{float:right;width*300px;}
div.section{clear:right;}
とします。

　これは、文書構造上、回り込みされる挿絵は、常にその対象となる記事の直前にあるはずだからです。
　次のsectionでは、その挿絵は関係ないのですから、sectionが変わる時点でfloatを解除します。

　そうすることで、ウィンドウ巾やフォントサイズが変わっても常に該当する記事の側で、記事を回りこませることが出来ます。

この回答へのお礼

不可能なんですね。
丁寧なご説明ありがとうございました。

お礼日時：2012/01/12 16:50