减少搜索结果中标题和描述之间的空间

Question

我为网站创建了一个显示标题和说明的搜索页面。标题和描述之间有很多空格。

以下是显示结果的示例代码

echo "<div class=\"main\"><ul><li><h3><a href='$link' style='text-decoration: none'><b>$title</b></a></h3>$description </div></li></ul>";

虽然没有＆＃34; br＆＃34;在标题和描述之间标记它们之间有很大的空间。如何摆脱这个空间。你能告诉我这里的情况吗？行高函数是否适用于此处？

这里是css代码

.main {
position:relative;
font-size:1.01vw; 
color:Black;
font-family: Helvetica; 
top:3.5vw;
left:26vw;
}

由于

Answer 1

这是因为<h3>是块级元素。

您需要向其添加style=float:left; width:auto。

Answer 2

请使用下面的CSS缩小空间：

h3{padding: 0;  margin:0; line-height:normal;}

Answer 3

如果您仔细查看HTML，那么在结束</li></ul>之前</div></li></ul>之前关闭div

echo "<div class=\"main\"><ul><li><h3><a href='$link' style='text-decoration: none'><b>$title</b></a></h3>$description </div></li></ul>";

应为</li></ul></div>

echo "<div class=\"main\"><ul><li><h3><a href='$link' style='text-decoration: none'><b>$title</b></a></h3>$description</li></ul></div>";

并在CSS中添加

h3 {
    margin: 0px;
}

Fiddle