Css 如何使引导下拉菜单的宽度灵活？

在Bootstrap 3中，我想在下拉菜单中添加几个链接：

    <li class="dropdown">
            <a id="alert" data-toggle="dropdown" class="dropdown-toggle"  href="#" title="Notification">Notifications </a>

            <ul id="noti" class="dropdown-menu">
                 {% for t in alerts%}
                   <li> 
                     <a href="/article/{{t.slug}}">{{t.title}}</a>
                   </li>
                 {% endfor %}
            </ul>     
    </li>

{警报%中的t为%0}


{%endfor%}

---

问题是每个链接都有不同的宽度，所以我想知道如何定义css来包装菜单中最长的链接？

尝试在以下链接中定义解决方案：

---

我有一个实现代码段，您可以根据需要进行更改。主要部分是CSS更改：

。下拉菜单{
最大宽度：180像素；
}
.下拉菜单LIA{
显示：块；
溢出：隐藏；
文本溢出：省略号；
}

下拉列表

试试这个

 <li class="dropdown">
        <a id="alert" data-toggle="dropdown" class="dropdown-toggle"  href="#" title="Notification">Notifications </a>

     <div class="dropdown-menu" style="width: auto;">
        <ul id="noti" >
             {% for t in alerts%}
               <li> 
                 <a href="/article/{{t.slug}}">{{t.title}}</a>
               </li>
             {% endfor %}
        </ul>     
     </div>
</li>

{警报%中的t为%0}


{%endfor%}

---

我所做的就是在“ul”周围贴上“div”标签。这个对我有用。

我试过那个css。它不起作用。你能详细说明一个独立的答案吗？这很好，但没有完整显示我想要的最后一个链接。你可以更改“最大宽度”属性的值或指定宽度：CSS中下拉菜单类的100%。