如何根据<a> tag inside of it?</a>的高度更改li的高度

Question

我有一个无序列表，我的每个项目都有一个边框底线，用于分隔项目以提高可读性。在我的每个li项目中，有一些div，每个div内部都有文本或超链接。有时div中文本的长度是多行很长，我想确定文本是否太长，然后我的li的高度动态变化，因此li的border-bottom将它与下一个分开。

这就是我的标记的样子：

<li class="sfeventListItem">
    <div class="Name">
        <a id="DetailsViewHyperLink1" title="" class="tooltip" href="#">Identification and Classification of Nonconformities in Elastomeric Closures and Aluminum Seals for Parenteral Packaging: Covering Vial Closures, Pre-filled Syringe and Cartridges Components</a>
    </div>
</li>

这是我的风格：

li.sfeventListItem
{
    border-bottom: 1px solid #e3e3e3;
    min-height: 30px;
    display: block;
}

li.sfeventListItem .Name a
{

}

这就是我的商品在我的网站上显示的方式，这不是我想要的：http://i.imgur.com/ZCoT5rq.jpg

Answer 1

给李height: auto，它的高度会根据孩子的身高自动调整

li
{
height:auto;
}

Answer 2

将链接设为块元素并指定顶部和底部填充。