classes vs data-type…

Kevin’s CSS often includes declarations, such as “.container[data-type=“wide”]”.

But I’m struggling to understand how this approach differs from using two classes.

Thanks!

Joao•12/3/23, 5:19 PM

Using data attributes is a more expressive way to qualify html elements in some way. You can still target them with CSS and JavaScript so there's no need to use them, but for single-purpose attributes it may make more sense to use them.

Joao•12/3/23, 5:20 PM

For example to describe something is opened or closed.

Joao•12/3/23, 5:24 PM

You can do the same with CSS but you can use a single property and target it differently in CSS:

But you can also do:

It's just a little more descriptive and can be used for displaying text for things like tooltips for example: