CODEWITHSUNDEEP
htmlcsstailwind-css
rubie
rubie

Reputation: 2236

CSS - computed border color doesn't match actual border color

I have some ordinary buttons with a Tailwind class border-myCustomColor. In the computed styles in devtools, all sides are identical. But in the screenshot, you can see that the bottom/right sides are different to the top/left sides.

enter image description here

BUT

enter image description here

I'd love to a) fix it; but mostly b) understand how the computed styles could be wrong

If some other effect was being inherited from somewhere, shouldn't that be reflected in the computed styles?

Upvotes: 1

Views: 572

Answers (1)

Mikołaj Mrózek
Mikołaj Mrózek

Reputation: 60

It looks like you're using border-style: outset.

Try adding border-style:none, or border-style:solid in your desired border css property. To make it more compact you can also use border: {width} solid {calculated color}

See examples

Upvotes: 3

Related Questions