我刚到tailwindcss。但我这里有个问题。
看截图，背景颜色没有应用在导航栏中。而且整个html主体在中小屏幕中没有得到全宽。
我不明白的是，我还没有使用tailwindcss中的任何响应类，如md、sm或lg。但宽度有严重的问题，我尝试使用w-full和w-screen的tailwindcss类。它们都不起作用。以下是问题的截图x1c 0d1x

您可以在此处找到代码：https://codesandbox.io/s/focused-curran-jdyup
提前致谢。
编辑：
好的，看这个动图，伙计们。
x1c4d 1x指令集
我试图在Tailwind Play中重现这个问题。但是我做不到。然后我注意到同一行代码在Tailwind Play中可以很好地工作，但在nextjs中却不行。我不知道这里的问题是什么，但我在下面分享了Tailwind Play和NextJS代码。Tailwind Play：

<div class="flex justify-between items-center p-5 bg-indigo-800 text-white">
      <div class="ml-16">
        <div class="flex items-center">
          <div class="">
            <h4 class="tracking-widest uppercase">GrayScale</h4>
          </div>
          <div class="lg:hidden">
            <button
              type="button"
              class="text-gray-400 mt-1 hover:text-white focus:text-white focus:outline-none"
            >
              <svg
                class="w-6 h-6"
                fill="none"
                stroke="currentColor"
                viewBox="0 0 24 24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <path
                  strokeLinecap="round"
                  strokeLinejoin="round"
                  strokeWidth="2"
                  d="M4 6h16M4 12h16M4 18h16"
                ></path>
              </svg>
            </button>
          </div>
        </div>
      </div>
      <div class="mr-16">
          <a
            key={link.label}
            class="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md"
          >
            Home
          </a>
          <a
            key={link.label}
            class="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md"
          >
            Home
          </a>
          <a
            key={link.label}
            class="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md"
          >
            Home
          </a>
          <a
            key={link.label}
            class="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md"
          >
            Home
          </a>
          <a
            key={link.label}
            class="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md"
          >
            Home
          </a>
      </div>
    </div>

NextJS代码：

export default function IndexPage() {
  return (
    <div className="flex justify-between items-center p-5 bg-indigo-800 text-white">
      <div className="ml-16">
        <div className="flex items-center">
          <div className="">
            <h4 className="tracking-widest uppercase">GrayScale</h4>
          </div>
          <div className="lg:hidden">
            <button
              type="button"
              className="text-gray-400 mt-1 hover:text-white focus:text-white focus:outline-none"
            >
              <svg
                className="w-6 h-6"
                fill="none"
                stroke="currentColor"
                viewBox="0 0 24 24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <path
                  strokeLinecap="round"
                  strokeLinejoin="round"
                  strokeWidth="2"
                  d="M4 6h16M4 12h16M4 18h16"
                ></path>
              </svg>
            </button>
          </div>
        </div>
      </div>
      <div className="mr-16">
        <a className="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md">
          Home
        </a>
        <a className="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md">
          Home
        </a>
        <a className="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md">
          Home
        </a>
        <a className="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md">
          Home
        </a>
        <a className="p-2 pr-2 uppercase tracking-widest font-semibold hover:bg-indigo-900 hover:text-gray-400 rounded-md">
          Home
        </a>
      </div>
    </div>
  );
}