reactjs 为什么顶部边距在Tailwind CSS中不起作用？

eit6fx6z 于 2023-01-25 发布在 React

关注(0)|答案(1)|浏览(150)

我试图在first中设置mt-10的顶部边距，但它不起作用。然而，如果我将表达式设为mx-10，它就起作用了。

<div className="font-bold text-white">
  <a id='first' className="mt-10">Explore</a>
  <a id='second' className="mx-4">Collections</a>
  <a id='third' className="mx-4">Profiles</a>
</div>

reactjs

来源：https://stackoverflow.com/questions/70837138/why-margin-top-does-not-work-in-tailwind-css

1条答案

按热度按时间

n53p2ov01#

当谈到边距和填充时，浏览器对待内联元素的方式不同。你可以在内联元素的左右两侧添加空格，但是你不能在内联元素的顶部或底部填充或边距上添加高度。给<a>标签一个inline-block类来解决这个问题。

<div className="font-bold text-white">
  <a id='first' className="mt-10 inline-block">Explore</a>
  <a id='second' className="mx-4 inline-block">Collections</a>
  <a id='third' className="mx-4 inline-block">Profiles</a>
</div>

reactjs 为什么顶部边距在Tailwind CSS中不起作用？

1条答案

相关问题

热门标签

最新问答