F
18

TIL you can debug CSS by drawing boxes with borders in a specific color code

Anyone else use a weird trick like that to spot spacing problems faster?
3 comments

Log in to join the discussion

Log In
3 Comments
carter.joseph
Yeah, using transparent borders helps me see element overlaps instantly.
2
jamesf29
jamesf291mo ago
Oh geez, I hate to be that guy but transparent borders won't actually show you overlaps. They make the element invisible too so you can't see where one box ends and another starts. You probably want a semi-transparent background color or a dashed outline instead for that.
8
brianreed
brianreed1mo ago
Man, I gotta disagree with you on this one James. I've been using transparent borders for years (like since CSS3 was new) and they work great for layout debugging if you pair them with box-sizing. @carter.joseph is onto something - it's all about how you use them, not just slapping them on blindly.
3