cant change variables in @media query

[ksawery29]

Hi, I'm trying to change $width variable in media query when the screen size is 500px, but it isn't changing. Here's my code:

$width: 200px;

div {
  width: $width;
}

@media (min-width: 500px) {
  $width: 100px;
}

It's worth adding that I can change variables in other elements like this:

div {
  $width: 100px;
  width: $width;
}

[ai]

This variables doesn’t work like this. You need to use CSS Custom Properties for this feature.

[ksawery29]

oh yeah I didn't think about it, thanks