DEV Community 👩‍💻👨‍💻

Discussion on: 5 CSS tips you didn't know you needed

javamajk profile image

Yeah indeed, things can get messy in this case.

Thread Thread
dan503 profile image
Daniel Tonon

I was a box-sizing: inherit; person, then I realised this is super useful:

.page-restrictor {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: content-box;

It means that when the screen is less than 1240px wide, it will have a 20px gap down either side of the screen with no need for media queries.

This technique doesn't work with box-sizing: inherit; though.