CSS盒模型不拉伸使用填充(css box model does not stretch using

我有一个项目名称为我的网页标题。 该项目的标题是一个名为“PAGETITLE”专区内。 该项目冠军后，我有一个必须是在左边，另一个在右边的两个单词。 我希望“PAGETITLE”内的白色背景上的一切div的，这两个词后在底部留下小有一点空间。 我曾尝试“填充底：10px的”两个词。 然而，在白色背景上不拉伸覆盖，包括10px的。 我想知道我应该怎么办呢？

干杯，正虹

<div class ="pagetitle" style="background-color:black;">
        <center style="padding: 10px 0 0 0">Executive Summary Dashboard<center>
        <br><left style="float:left; padding:0 0 10px 10px;">Subject Selected:</left><right style="float:right;padding:0 10px 10px 0; background-color:green; margin-bottom:10px;">Time frame:</right></br>
        </div>

Answer 1:

你需要清除浮动。

1. 添加到您的CSS

   .clearfix：之前，.clearfix：后{内容： “\ 0020”; 显示：块; 高度：0; 溢出：隐藏; } .clearfix：后{明确：两者; } {.clearfix变焦：1; }

2. 类.clearfix添加到您的顶格让你有DIV CLASS = “PAGETITLE clearfix”

Answer 2:

你要“遏制”你的花车。 实现被设置的一种方式overflow: hidden在容器元素上。 有一千个其他技术虽然被称为clearfixes（你可以在互联网上找到了很多），他们中的一些涉及将一个元素与clear: both就可以了。

• 的jsfiddle演示与您的代码固定

有些人建议阅读：

• 在怪异模式清除浮动
• 可以溢出：隐藏影响布局？
• http://colinaarts.com/articles/float-containment/

Answer 3:

-左，右不是有效的HTML标签

- 独立的HTML和样式（使用外部样式表）

例如拨弄

文章来源: css box model does not stretch using padding