css - 两个 float 图像之间的 DIV 大小不正确

Question

我需要使用设计师创建的自定义图像创建一个对话框。出于本次讨论的目的，这是我的申请的正确答案。对话框必须能够承受宽度和高度的变化。使用表格很容易做到这一点，但我想保持无表格设计，所以我想我可以使用 3 行 DIV 来做到这一点。例如，向左浮动一个图像，向右浮动一个图像，然后在它们之间放置一个 DIV，并将图像设置为背景，以便可以在其上输入文本。

这是我尝试这样做失败的演示:(仅显示一行) http://www.seaburydesign.com/rounded/demo.html

如您所见，这几乎可以正常工作。但是中间的DIV只是里面内容的大小，虽然我设置了高和宽。我需要保持宽度灵活。

关于如何解决这个问题有什么想法吗？

Answer 1

删除以下行:

display:inline;

除了在这种情况下无用(内联行为因为 float 已经起作用)之外，“内联”属性不允许您设置元素的宽度或高度。为了更清楚地理解，请阅读 w3c's article .