Do you make this mistake with border-radius? #css

#css

--

Come hang out with other dev's in my Discord Community

Keep up to date with everything I'm up to

Come hang out with me live every Monday on Twitch!

---

Help support my channel

---


---

I'm on some other places on the internet too!

If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.


---

And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!

[spreadItWide]

Nice! Time to go fix my 36 projects that don't have the padding algo...

[abtix]

oh my god this is actually so so so useful, i've had many cases where i came across this issue and just eye balled it to fix it

[anonymouspanda]

Hey Kevin,
I'm applying to a web programming and development course for next year and want to thank you for all your shorts and videos as they have helped tremendously on my path towards my career.

[RajatKumar-jcnj]

Sir Kevin is at it again, yet another video of me learning new things subconsciously.

[joshuafountain]

Was literally having this issue a couple hours ago, thank you as always!

[DennisIvy]

I was today years old when I realised this

[CZghost]

This is why the calc() function exists.

[tonybowen]

Oh wow i had this problem just yesterday!

[goodshiro]

a note from me, a noob:
unless the padding is vertically and horizontally same, use variables to organize code

don't scold me if im wrong😅

[daya]

Hey Kevin, what would be the formula if parent had different block and inline padding values?

[bandekhoda-rand]

Damnnnn i was literally having this problem right now!

[sirstegi]

what should i do if the border-radius is bigger than the padding? i have a card with 4px border-radius and the image in it has the same, padding is 15px on the card, it looks okay to be honest. Do I have to change it only if the border radius exceeds the padding, is this a right assumption?

[mong-kay]

@KevinPowell, is there a trick for doing something like this when the padding exceeds the outer radius. If I have say a 12px outer radius and my padding is 16px then the result would be -2px.

[tresvecesno]

There's a way to make that using variables

[GolderiQ]

Not a pro in CSS here, but wouldn’t it be simpler to just have a border value and let it follow the inner thing ?

[pasizdobrekuce]

What if border radius and padding are same value?

[jonaspetersson]

Would you say this is best handled with variables to avoid the risk of missing to update the "dependants"?

[xenos]

Would it cause problems if you used a box-shadow instead to create the border?

[Jarrod]

I'd just make it an outline and avoid all that

[qobiljonrasuljonov]

what if i have padding and border radius same value ?