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

0 vote122 views2 answers
Counter-style counter css counters
CSS
2 votes81 views1 answer
How to bring default values in css
CSS
22 votes143 views2 answers
React bootstrap carousal not working
CSS
1 vote124 views1 answer
Css media queries between two sizes
CSS
83 votes136 views4 answers
Css placeholder color
CSS
79 votes147 views6 answers
Css media query
CSS
3 votes164 views1 answer
Css perfect box shadow
CSS
7 votes147 views2 answers
Vue sass loader
CSS
0 vote135 views1 answer
Input area bootstrap highlight
CSS
6 votes125 views5 answers
Flutter print
CSS