Question

所以考虑我有这两种情况：

http://jsfiddle.net/CtYYJ/＆lt; ----------第一个场景

这是一般情况，其中左div中的文本比右div上的输入元素长。

如何指定包装器的大小与右侧div元素长度相同，并且在同一场景中，右侧div输入元素在包装器的底部对齐，就像在我的第一个jsfiddle示例中一样？

我也在苦苦挣扎的另一种情况是，右边div中只有四个文本中的一个，而左边只有按钮。

如何将包装器重新调整为一行并使用与第一个方案相同的CSS样式显示内联元素？

http://jsfiddle.net/zfGeW/＆lt; ----------第二种情况

请给我一些关于这个原因的指示我对随机尝试使用

感到生气

height: auto;
min-height: 50px;

以及我在网上找到的其他CSS属性。

我仍然注意到没有办法让正确的div输入元素与底部对齐，而没有为包装器指定固定的大小，是不是有任何解决方法，并避免{{1标签？

以下是我正在谈论的两个场景的在线涂鸦：example

请记住，右边和左边div元素的内容是可变的，我摆弄的两个例子是极端情况：

左div内容更长，右div与右div内容对齐到底部。
左右div具有相同的内容大小，因此包装器在一行显示内容（左侧div文本，右侧div按钮）。

Answer 1

检查完图形后，我认为没有CSS方式可以满足您的要求。使用人造柱方法并将正确的内容定位在底部角落是绝对的解决方案吗？

http://alistapart.com/article/fauxcolumns

<div style="width:400px;position:relative;">
    <div style="height: 200px; width:250px;">left</div>
    <div style="height: 50px; width:150px;position: absolute;right: 0; bottom: 0;">right</div>
</div>

http://jsfiddle.net/26V6E/

Answer 2

你试过：身高：100％？

根据元素使Div自动调整大小 - 两列与底部对齐

2 个答案: