Tailwindcss 更改內聯元素的垂直 alignment

Question

我使用帶有 antd 的 tailwindcss 來開發我的網站。

下面兩個代碼沙箱展示了帶tailwindcss和不帶tailwindcss的同一個antd組件

• https://codesandbox.io/s/antd-collapse-u1diyl
• https://codesandbox.io/s/antd-collapse-with-tailwind-ubl1de

您可以看到，在第一個沙盒中，箭頭和文本垂直對齊，而在第二個沙盒中則不是。 第二個沙箱中的唯一變化是我包含了 tailwindcss。

然而，在 chrome 的檢查器中，兩個箭頭元素都具有相同的計算值 css 除了制表符大小（我認為這不會影響垂直對齊）。

垂直對齊	不垂直對齊

任何人都知道為什么 tailwindcss 會更改箭頭的垂直方向 alignment 以及如何修復它？ 我希望箭頭和文本元素垂直對齊。

Answer 1

您可以通過在 tailwind.config.js 中添加它來解決此問題

 corePlugins: {
    preflight: false,
  },