使文本完全包含在一个自举下拉菜单

Question

我有一个自举下拉按钮，而这个下拉ontains许多元素具有differente字体大小：

<ul id="tailles" class="dropdown-menu"> 
    <li><a style="font-size: 8px;">Petite (8px)</a></li> 
    <li><a style="font-size: 10px;">Petite (10px)</a></li> 
    <li><a style="font-size: 12px;">Petite (12px)</a></li> 
    <li><a style="font-size: 14px;">Normale (14px)</a></li> 
    <li><a style="font-size: 18px;">Grande (18px)</a></li> 
    <li><a style="font-size: 24px;">Grande (24px)</a></li> 
    <li><a style="font-size: 36px;">Grande (36px)</a></li> 
</ul> 

但下拉菜单长相丑陋，文本没有完全包含在它的容器中，我试图改变它们的高度，但没有成功。

我该如何解决这个问题？

编辑：

这是怎么回事的样子：

Answer 1

尝试li元素上设置CSS填充，填充一样：3px的0像素;或者你需要为每个li元素用css设置另一个行高。

并尝试设置字体大小li元素，而不是在一个标签

Answer 2

我认为这个问题是<li>元素的高度。试试它的高度设定为至少相同的字体大小，并添加一些像素的保证金...例如：
<li style="height:22px"><a style="font-size: 18px;">Grande (18px)</a></li>
<li style="height:24px"><a style="font-size: 20px;">Grande (20px)</a></li> ...等