this post was submitted on 27 Sep 2026
10 points (91.7% liked)

Programming

28593 readers
461 users here now

Welcome to the main community in programming.dev! Feel free to post anything relating to programming here!

Cross posting is strongly encouraged in the instance. If you feel your post or another person's post makes sense in another community cross post into it.

Hope you enjoy the instance!

Rules

Rules

  • Follow the programming.dev instance rules
  • Keep content related to programming in some way
  • If you're posting long videos try to add in some form of tldr for those who don't want to watch videos

Wormhole

Follow the wormhole through a path of communities !webdev@programming.dev



founded 3 years ago
MODERATORS
top 1 comments
sorted by: hot top controversial new old
[–] spartanatreyu@programming.dev 6 points 1 hour ago

border: 10px solid hotpink;

This should be: outline: 10px solid hotpink;.

Borders are calculated as part of the layout, so adding or changing a border also means potentially changing the layout. So just by trying to debug something, you're potentially making the problem worse. It's a heisenbug.

On the other hand, outline doesn't change the layout, it's drawn around the element. Also, you can usually see what the border was on the element which makes it easier to debug all that nested div slop that bootstrap/tailwind vibecoders like to produce. And, you can also offset the outline if you need to also see the borders of elements touching the one you're trying to debug.