Javascript 如何使React组件链接标记跨越100%的li标记？

由于某些原因，我的标签不会延伸到我的li标签的100%

这是我为这个下拉菜单提供的CSS

    .dropdown-menu {
      background: red;
      width: 200px;
      position: absolute;
      top: 80px;
      list-style: none;
    }

    .dropdown-menu li {
      background: #ff3734;
      padding: 16px;
      cursor: pointer;
    }
 

    .dropdown-link {
      background: lime;
      display: block;
      height: 100%;
      width: 100%;
    }

这是我的下拉组件，Link标记的类名是“dropdownlink”

函数下拉列表（）{
const[click，setClick]=useState（false）；
const handleClick=（）=>setClick（！click）；
返回(

{MenuItems.map（（项，索引）=>{
返回(

setClick（true）}
>
{item.title}

);
})}

);
}

---

在灰绿色链接标签周围有这样的间隔，我不知道发生了什么？

这似乎是因为

填充：16px

在

。下拉菜单li

中，您确定问题不是您的li标签。你能把li背景改成蓝色吗？你能添加代码沙盒链接吗？啊，这就解决了它！谢谢

      function Dropdown() {
        const [click, setClick] = useState(false);

        const handleClick = () => setClick(!click);

        return (
          <>
            <ul className={click ? 'dropdown-menu clicked' : 'dropdown-menu'}>
              {MenuItems.map((item, index) => {
                return (
                  <li key={index}>
                    <Link
                      className={item.cName}
                      to={item.path}
                      onClick={() => setClick(true)}
                    >
                      {item.title}
                    </Link>
                  </li>
                );
              })}
            </ul>
          </>
        );
      }