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

10 votes101 views1 answer
Css when click select another class
CSS
200 votes258 views6 answers
Background image
CSS
0 vote101 views1 answer
Repeating-linear-gradient
CSS
1 vote108 views1 answer
Multiple values in @media
CSS
1 vote109 views1 answer
Flexbox align or justify one single item
CSS
0 vote117 views1 answer
Lando expose database port
CSS
1 vote98 views1 answer
Import maxcdn.bootstrapcdn.com not in index.html in specific component file
CSS
0 vote108 views1 answer
Odoo search
CSS
4 votes117 views3 answers
Mobile tablet desktop media queries
CSS
0 vote102 views1 answer
~@danielmoncada/angular-datetime-picker/assets/style/picker.min.css"
CSS