W3QはBiztterに生まれ変わりました!
Web制作に関するお悩みはBiztterへどうぞ!

Biztterで質問する

ID:RuyS6K さんの質問

高さ不明の要素内での下揃えについて質問です。
下記の様なコードでレイアウトをしています。
-html-
<div>
<div class="d1">
text
</div>
<div class="d2">
<a href="#">text</a>
</div>
</div>

-style-
.d1{float:left;}
.d2{float:right;}
.d2 a{???}

d2の内要素であるaをd2内で下揃えにしたいのですが、どう記述すればよいか分かりません・・・。
各要素の高さは可変(不明)となっています。

よろしくお願いします。

みんなの回答 5 件

ID:3tBgQ/ さんの回答

昔ながらのテーブルレイアウトの出番です。

ID:RuyS6K

tableを使わずにレイアウトする方法はございませんでしょうか?

ID:3tBgQ/

じゃ、cssのdisplay:tableとdisplay:table-cellの出番だな。

ID:XUSd6v

vertical-align:bottomね。

ID:SUAcXG さんの回答

今風にやるなら、div.d1とdiv.d2をflexible boxで横並びにして、さらにdiv.d2の中もflexible boxで縦並びにして、aを一番下に追いやるという方法があります。

ID:25lPsR さんの回答

.d2 { position: relative;}
.d2 a { position: absolute; left: 0; bottom: 0;}

普通にこれだけでd2内最下部指定できるかと思いますが!
要件満たせることができなかったらすみません!

ID:HmESBc さんの回答

くそトピ主、トピ立て放置か。
タヒね。

ID:0CMK47 さんの回答

そのためのflex boxです

最終更新日:2016-03-03 (1,513 views)

関連するトピックス

ページ上部に戻る