1

我的网页中有一个项目标题作为标题。该项目标题位于名为“pagetitle”的 div 中。在项目标题之后，我有两个单词，一个在左边，另一个在右边。我希望“pagetitle” div 中的所有内容都使用白色背景，在这两个词之后的底部留下一点空间。我已经为这两个词尝试了“padding-bottom:10px”。但是，白色背景不会延伸到包含的 10 像素。我可以知道我该怎么做吗？

干杯，郑红

<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>
4

3 回答 3

1

你需要清除浮动。

  1. 将此添加到您的CSS

    .clearfix:before, .clearfix:after { 内容："\0020"; 显示：块；高度：0；溢出：隐藏；} .clearfix:after { clear: both; } .clearfix { 缩放：1；}

  2. 将 class .clearfix 添加到您的顶级 div 以便您拥有 div class="pagetitle clearfix"

于 2012-08-23T10:02:06.937 回答
1

你必须“包含”你的花车。实现这一点的一种方法是overflow: hidden在容器元素上进行设置。不过，还有一千种其他技术，称为 clearfixes（您可以在 Internet 上找到很多），其中一些涉及clear: both在其上添加元素。

一些建议阅读：

于 2012-08-23T10:02:31.837 回答
0

-left 和 right 不是有效的 html 标签

- 分离您的 html 和样式（使用外部样式表）

示例小提琴

于 2012-08-23T10:08:07.583 回答