右对齐最大宽度div中的图像

Question

我有一个最大宽度为700px的包装div，唯一的内容是宽度小于700px的右对齐图像。由于它没有填充它，包装器不会扩展到700px。当浏览器窗口中有空间时，如何使包装器扩展到整个宽度？到目前为止，我发现的唯一一个黑客还包括一个零高度跨度，其中包含多行文本......

Answer 1

默认情况下，div应水平扩展到其父对象的宽度。尝试将div上的宽度设置为700px。

Answer 2

您可以在700px div上设置overflow: hidden，假设您没有设置明确的高度。

Answer 3

正如CRasco提到的那样，Div通常会扩展以填充其容器，直到我们带来一些花哨的风格并搞砸了。以下是我能想到的样式，这将阻止Div扩展以填充其容器：

这些将使其成为保存其内容所需的最小尺寸。

• float: left;
• float: right;
• display: inline;
• display: inline-block;

当然，其中任何一个都会限制Div的大小。我打赌你已经注意到这些是否会导致你的问题，但我认为我应该把它们包括在内尽可能完整。

• width: 100px;
• max-width: 100px;
• height: 100px;
• max-height: 100px;

Answer 4

如果您知道图像的内容，则可以为其添加边距。