删除不必要的空白区域

时间:2012-10-17 17:36:28

标签: javascript html css whitespace

我有这个片段类,用红色标记一个区域。我的系统分为两种类型:类别和规则。当规则被分段时,它们会很好地接收新的css类并且它看起来很合适,但它与类别不同,它们在类别的顶部有不必要的空白区域。

以下是我的意思截图:

the unnecessary whitespace

这是一个现场演示,您可以查看源代码以获取更多信息,因为我不能提供正确的代码,因为我不是该风格的原始作者:

http://zirotec-uka.com/dugi/phpBB3/rules.php#rule1

谢谢。

5 个答案:

答案 0 :(得分:1)

您有一条规定h3 { margin-top: 20px; }的规则。这就是导致空间的原因。

您可以使用#main h3 { margin-top: 0; }覆盖该内容。

答案 1 :(得分:1)

您需要设置

#main ul h3, #main ol h3 { margin-top: 0;}

答案 2 :(得分:0)

您只需要删除“填充”CSS元素。

您可以按如下方式静态执行此操作:

$("#rule1").css("padding-top", "0px");

了解它现在的样子:

http://imgur.com/erWTH

答案 3 :(得分:0)

这是由.fragment中的填充引起的(style.php:4007)

.fragment {
    padding: 5px 5px 0 5px;
    background-color: #ECD5D8;
    color: #BC2A4D;
    font-weight: bold;
}

您需要更改或覆盖它。

答案 4 :(得分:0)

问题是由浏览器设置的默认填充,可以通过遵循规则

来解决

#rules li{ padding:0px;}