html - 具有可变高度的CSS div绝对位置以扩展容器

Question

我已经搜索并寻找了几个看起来与我的问题相似的帖子，但是我没有找到让我更接近解决方案的答案。

所以我有点受困于 DIV 设置，我有一个围绕两个 DIV 的容器。第一个 DIV 将有一个 Logo ，该 Logo 应始终位于左上角(位于那个亲戚的位置)。现在第二个 DIV 应该总是从容器的右下角开始，有一些变量文本(绝对定位)。

如果第二个 DIV 中的文本很短，一切都很好，但是如果文本越来越大并且比 Logo 还大，文本将超出容器的顶部。

如果文本变大，我的目标是容器随绝对 DIV 增长。

我设置了一个 fiddle 来向您展示我的问题。

[jsfiddle.net/jb3drnb0][1]

我错过了什么？

Answer 1

非常感谢您的所有建议。它让我对这个问题有了不同的看法。我尝试了 float ，它很接近但并不完美。 Sidd 对 Javascript 的建议最终让我尝试了 CSS Calc 功能并使用带宽度参数的内联 block ，并使用文本对齐和垂直对齐来实现我想要的。

所以这是一个更新的 fiddle对于所有感兴趣的人。 :)

.container { position: relative; height: auto; border: 1px solid #00f; overflow: visible; }

.left { display: inline-block; width: 160px; height: auto; vertical-align: top; }

.right { display: inline-block; height: auto; width: calc(100% - 170px); vertical-align: bottom; text-align: right; }