[v4] Individual side borders are broken

[shrutibalasawebdev]

What version of Tailwind CSS are you using?

For example: v4 alpha

What build tool (or framework if it abstracts the build tool) are you using?

Tailwind CLI

What browser are you using?

Chrome v122

Reproduction URL

https://github.com/shrutibalasawebdev/test-tailwindcss-v4

Describe your issue

Adding single side borders like this
<div class="p-8 border-t-4 border-indigo-500">Hey</div>
gives border on all sides.

[znycheporuk]

It's valid behaviour, to style only top border you have to use border-t-indigo-500
https://tailwindcss.com/docs/border-color#individual-sides

[shrutibalasawebdev]

Well, even that doesn't work. Did you try in v4-alpha?

And anyway, the classes I've used works in v3.4.1
https://play.tailwindcss.com/xEqCvVZWNC

So if it doesn't work anymore, it's a huge breaking change.

[adamwathan]

Thanks for catching! PR open to fix it here: #13124

[adamwathan]

Fixed, will tag a release shortly 👍

[adamwathan]

Update to v4.0.0-alpha.6 and this is fixed!

[shrutibalasawebdev]

Works perfectly fine! Tested on Chrome and Firefox Nightly too. Thanks for the super quick fix.