我想将div对齐到同级div的底部,而不知道该同级div的高度。这是我正在使用的布局:http://abbymilberg.com/sample-layout.html

我想让右手div与左手div的底部对齐,而无需在上边距进行硬编码,因为在我的最终项目中,左手div中的内容将是动态的,高度将是千变万化。

我不知道使用CSS的方法。我猜想也许有某种方法可以使用javascript获取元素的高度,但是对任何可行的方法都开放。

<head>

    <style type="text/css">

        #body{text-align:center; margin:0px;}

        #wrapper{border:solid 1px; margin:10px auto 10px; width:800px;
        padding:10px; text-align:left; }

        #left{margin-right:160px; border:solid 1px;}

        #right{float:right; border:solid 1px; width:150px;}

    </style>

</head>

<body>

    <div id="wrapper">

        <div id="right">
            <h2>Right</h2>
        </div>

        <div id="left">
            <h2>Left</h2>
        </div>

    </div>

</body>

</html>

最佳答案

使用绝对和相对定位:

#wrapper {
  position: relative;
}

#right {
  position: absolute;
  bottom: 0;
  right: 0;
}


Demo

关于css - 将div对齐到同级div的底部,而不知道同级div的高度,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/13335510/

10-12 12:41
查看更多