5

重複の可能性：
divをコンテナーの下部にフロートさせるにはどうすればよいですか？

divをdivの右下にフロートさせるこのコードがあります。しかし、スパンは左上に固定されます。

<div id="color_tile" class="select_tile" title="Choose color" style="background: grey; background-image: url(wallpaper/201_color_picker.jpg);" >    
  <span id="color_picker" style="visibility: visible; display: block; float: right; vertical-align: bottom;"></span>
</div>

スパンを配置する別の方法はありますか？

4

2 に答える 2

8

おそらく、HTML/CSSを互いに適切に分離する必要があります。

コードは次のようになります

HTML：

<div>
    <span>Absolute right bottom aligned to div...</span>
</div>

CSS：

div { position: relative; }
div > span { position: absolute; right: 0; bottom: 0; }

明らかに、divはスパンの高さ/幅を超える高さ/幅を持っている必要がありますが、一般的にこれは非常に受け入れられる方法です。

これは、スパンの周りのdiv'フロー'のコンテンツを作成しませんが、それは明確に指定されていません。すでに述べたように、その場合は、そこにあるものが機能するはずです。そうでない場合は、コードの残りの部分にあります。

于 2012-05-30T18:54:37.567 に答える
0

vartical-alignは仕事に取り掛かるのに非常に特別です（それが私がほとんどそれを使用しない理由です）

スパンで： position:absolute; bottom:0; right:0;

親divに高さ/幅を設定すると、すべて設定されます

于 2012-05-30T18:53:23.937 に答える