如何同时应用宽度，最小宽度和最大宽度

Question

I have a div, and I am given 3 values for the width of the div. The normal width of the div is 120px, the min width of the div is 90px, and the max width of the div is 150px. I guess I am asked to apply these values based on the width of the screen. I would like to know how to write css for this?

I have tried below code, but it seems my div is always 120px.

  .myDiv {
      width: 120px;
      max-width: 150px;
      min-width: 90px;
  }

Should I use media query?

Answer 1

Max-width and min-width as px will only have an impact if your width is used with percents %

(or other window based width like vw ).

In your case I think indeed the best thing to do is use media queries.