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

8 votes208 views5 answers
Flex margin between items
CSS
66 votes193 views6 answers
Rotate element css
CSS
4 votes208 views2 answers
Css trim text
CSS
0 vote246 views1 answer
Crypto module
CSS
0 vote194 views1 answer
Html print page break
CSS
0 vote221 views1 answer
Tar xz
CSS
15 votes212 views3 answers
Image rotate with css
CSS
6 votes229 views2 answers
Css border
CSS
1 vote196 views1 answer
Timesheet template html css
CSS
22 votes215 views5 answers
Css grid center
CSS