html - float DIV 在底部添加填充

Question

对于带有背景色的 float div 有一个奇怪的问题。

我们设计了一个 div 来模拟客户端的横幅功能。横幅可以与文本左对齐/右对齐，也可以两者都不对齐。

当横幅没有对齐时，横幅看起来应该是正确的。但是，当横幅向左/向右浮动时会添加额外的填充。

Here's an example - http://jsfiddle.net/ZSE93/

如果您有任何想法，那就太好了。或者，如果您有任何疑问，我会很乐意为您解释。

干杯

Answer 1

这是由于内部 p 上的 margin-bottom，下面是解决此问题的两个选项

.banner p {
    font-size: 12px;
    margin-bottom: 0;
}

或

.banner p {
    font-size: 12px;
    display: inline-block;
}

还有一个 fiddle显示修复。