Navbar子菜单文本换行问题求助

要让子菜单项保持单行显示，有两种简单可行的解决方式：

方法一：强制文本不换行 #

直接给子菜单的<ul>标签添加Tailwind的whitespace-nowrap类，强制所有子菜单项文本保持单行：

<link href="https://cdn.jsdelivr.net/npm/daisyui@5.0.0-beta.2/daisyui.css" rel="stylesheet" type="text/css" />
<div class="flex flex-col min-h-screen">
  <div class="navbar bg-base-100 shadow-sm">
    <div class="flex-1">
      <a class="btn btn-ghost text-xl">daisyUI</a>
    </div>
    <div class="flex-none">
      <ul class="menu menu-horizontal px-1">
        <li><a>Inici</a></li>
        <li><a>Inscripcions</a></li>
        <li>
          <details>
            <summary>Recorreguts</summary>
            <!-- 添加whitespace-nowrap类 -->
            <ul class="bg-base-100 rounded-t-none p-2 whitespace-nowrap" >
              <li><a>Marxa 10k</a></li>
              <li><a>Express 16k</a></li>
              <li><a>Puigcerver Trail 23k</a></li>
            </ul>
          </details>
        </li>
        <li><a>Reglament</a></li>
        <li><a>Informació</a></li>
        <li><a>Contacte</a></li>
      </ul>
    </div>
  </div>
</div>

方法二：设置子菜单最小宽度 #

如果希望子菜单有固定的最小宽度，避免文本因空间不足挤压换行，可以给子菜单的<ul>添加min-w-[200px]类（数值可根据实际文本长度调整）：

<ul class="bg-base-100 rounded-t-none p-2 min-w-[200px]" >

原理说明 #

daisyUI默认的子菜单样式未强制文本单行，当文本长度接近菜单默认宽度时会自动换行。whitespace-nowrap属性会直接阻止文本换行，而min-w-*则通过设置最小宽度，让菜单有足够空间容纳单行文本。

内容的提问来源于stack exchange，提问作者Jordi Cabré