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

3 votes183 views2 answers
How to make hover effect none in css
CSS
1 vote193 views1 answer
Css super smooth shadow
CSS
0 vote195 views1 answer
Connect style sheet to html document
CSS
12 votes196 views2 answers
Center a cpontent css
CSS
1 vote188 views3 answers
Background image in css is not working
CSS
0 vote202 views1 answer
Textbreak for long text
CSS
0 vote161 views1 answer
Make clicks pass through element css html
CSS
101 votes198 views4 answers
Css top padding
CSS
21 votes198 views5 answers
Text-overflow: ellipsis 2 lines
CSS
1 vote241 views1 answer
Css ganzer button anklickbar
CSS