分辨率降低时禁用徽标大小调整答案

【问题标题】：Disable logo resizes when resolution is reduced分辨率降低时禁用徽标大小调整
【发布时间】：2022-01-01 17:00:37
【问题描述】：

我在创建菜单时遇到问题，在宽屏幕上，一切都很好，但是当我切换到移动分辨率时，我的徽标会逐渐缩小。

我想保持相同的尺寸。

<div className=" bg-white text-white border-b border-neutral-200">
      <div className="flex justify-around items-center align-middle lg:w-9/12 m-auto text-black  ">
        <div className=" lg:hidden w-1/5 flex justify-start">
          <MenuAlt1Icon className=" h-8 text-black hover:text-neutral-600 cursor-pointer" />
        </div>
        <ul className="relative hidden lg:flex justify-around  items-center text-center space-x-6 font-semibold hover:cursor-pointer md:order-1 ">
          <li className="hover:text-neutral-600">Home</li>
          <li className="hover:text-neutral-600">Acupuncture LotusPro</li>
          <li className="hover:text-neutral-600">About us</li>
          <li className="hover:text-neutral-600">FAQ</li>
          <li className="hover:text-neutral-600">Track my parcel </li>
          <li className="hover:text-neutral-600">Contact us</li>
        </ul>
        <div className="flex items-center w-1/5 lg:order-0">
          {" "}
          <Image
            src={mypic}
            alt="Picture of the author"
            width="210px"
            className="object-contain"
          />
        </div>

        <div className="flex right-0 justify-end lg:justify-evenly w-1/5 lg:order-3">
          {" "}
          <ShoppingBagIcon className="h-10 w-7 text-black hover:text-neutral-600 cursor-pointer" />
        </div>
      </div>
    </div>

非常感谢！

【问题讨论】：

标签： html css tailwind-css

【解决方案1】：

我不熟悉 Tailwind CSS，但我认为您可以使用 min-width CSS 属性。这是在 Tailwind 中使用它的方法

<div class="min-w-[50%]">
  <!-- ... -->
</div>

您可以使用this 文档了解更多关于顺风最小宽度的信息。

【讨论】：