使<a>標記與文本寬度相同

Question

我有一個帶有兩個鏈接的菜單選項。當行換行時，<a>標籤比它包含的文本寬，使第二個'+'鏈接太遠。我可以使<a>標籤與其包含的文本一樣寬嗎？

<li class="has-submenu"> 
    <a href="/pages/litigation">Litigation & Dispute Resolution</a> 
    <a class="expand-nav" href="#">+</a> 
</li> 

的<li>是display: flex，所述<a>的是display: inline-block。

Answer 1

嘗試將此添加到您的CSS。這將阻止文本進入下一行，並將使其佔用所需的所有空間。

.has-submenu a:nth-child(1){ 
    white-space:nowrap; 
    width:auto; 
}