Post

Hey! I enjoyed the article but this part left me puzzled: @​media not all and (min-width: 480px) I expected something like @​media (max-width: 480px) …instead. Am I missing something? Thanks!

`min-width: 480px` and `max-width: 480px` are both inclusive - so they will both be valid at (exactly) 480px. To make avoid the overlap you would have to write something like `max-width: 479.95px` - which is annoying 😅 So cleaner route would be to just negate `min-width` with a `not` ...

How about @​media (width > 480px) @​media (width <= 480px) They don't overlap!

The `not all` is a requirement in older browsers (older than Safari 16.4) developer.mozilla.org/en-US/docs/W...