div中的ul和p之间的垂直空间

时间:2014-07-16 15:03:25

标签: html css

我有一个带有风格的课程的div如下所示。

.testclass{
    display:inline-block;
    border:1px #efefef solid;
    clear:both;
    float:left;
    margin:0 0 25px;
    padding:25px 20px 20px;
}
.testclass p{
    font-size:12px;
    color:#666;
    margin:0;
    padding:0 0 20px;
 }
.testclass ul{
    list-style:outside;
    list-style-image:url(/images/img/bullet.png);
    margin:0 0 0 20px;
    padding:0 0 20px;
}
.testclass li{
    font-size:12px;
    color:#666!important;
    padding:0 0 10px;
}

<div class="testclass" style="padding-top:5px">
    <p>blah blah</p>
    <ul>
        <li>one</li>
    </ul>

我有一个div容器的页面,有段落和ul。我在ul和段落之间有一个垂直空间。 如何摆脱垂直空间。附上是一张图片。

enter image description here

2 个答案:

答案 0 :(得分:1)

你的p元素有底部填充:

.testclass p{font-size:12px;color:#666;margin:0;padding:0 0 **20px**;}

只需将其设为0.这是FIDDLE

答案 1 :(得分:-1)

尝试

.testclass li{
  font-size:12px;
  color:#666!important;
  padding:0 0 20px;
  margin-top: -10px
}

您可以更改margin-top值以获得所需的结果。

Fiddle

这有帮助吗?