Css 设置li包裹填充

我已经试过了，但不能让li tag完全用它的填充物包裹一个标签。我想李的宽度取决于a的填充物，但无论我如何尝试，它都不起作用，如果你知道是什么问题，请帮助我

  <ul>
     <li><a href="#">TAB 1</a><br />
       <ul class="sub-ul">
          <li>TEXT1</li>
          <li>TEXT1</li>
       </ul>
    </li>
    <li><a href="#">TAB 2</a><br />
      <ul class="sub-ul">
         <li>TEXT2</li>
         <li>TEXT2</li>
     </ul>
 </li>  
</ul>

//STYLE
ul >li {display: inline-block; margin-left: 0;} 
ul >li > a {padding: 10px 15px;}  I need li wrapping around this padding.

文本1
文本1





文本2
文本2



//风格
ul>li{显示：内联块；左边距：0；}
ul>li>a{padding:10px 15px；}我需要li包裹这个填充物。

我想这就是你要找的。希望能有帮助

li {
    display: inline-block;
    margin-left: 0;
} 
li > a {
    padding: 10px 15px;
}
li ul li {
    display: block;
}

---

a

元素在默认情况下是

内联的

，因此它们的填充并不真正适用于它们周围的事物。添加

display:inline block

-或者甚至

display:block

，然后将

放在后面。非常感谢您。另外，由于父级上已经有

display:inline block

，您可以使用

display:inherit