>
Tailwind CSSでcalcが効かない時の確認事項について説明します。
Next.jsを例に説明します。以下のコードではCSSが正しく反映されません。
<div className="w-[calc(100% / 2 - 0.5rem)]">
スペースを消すか、スペースを_に置き換えると、正しく反映されます。
<div className="w-[calc(100%/2-0.5rem)]">
<div className="w-[calc(100%_/_2_-_0.5rem)]">
関連記事