Css clamp vs media queries

<article>
  Lorem ipsum ...
</article>

/* Using clamp -------------------------- */
article {
  width: clamp(200px, 50%, 800px);
}


/* Using media queries ------------------ */
/* Default */
article {
  width: 50%;
}

/* Small screens */
@media only screen and (max-width: 600px) {
  article {
    width: 200px;
  }
}

/* Large screens */
@media only screen and (min-width: 1200px) {
  article {
    width: 800px;
  }
}

Similar codes

1 vote318 views1 answer
Css make background visible in text
CSS
1 vote308 views1 answer
Css super smooth shadow
CSS
11 votes342 views6 answers
Transition css
CSS
3 votes290 views1 answer
Css scaling border radius
CSS
33 votes288 views4 answers
Css background collor
CSS
27 votes307 views4 answers
Css keyframes
CSS
0 vote337 views1 answer
Taille texte css
CSS
8 votes309 views2 answers
Background image no repeat fill
CSS
2 votes302 views1 answer
Bootstrap 5 auto darkmode 5
CSS
4 votes373 views1 answer
Bootstrap file select class
CSS Bootstrap