CODEWITHSUNDEEP
cssmaxwidthmin
Alexander Dimitrov
Alexander Dimitrov

Reputation: 121

Width of div set to either min-width or max-width

I have set a min-width and a max-width to a div. How can I make it so the div's width is set to max-width if there is enough space and if there isn't enough space the width to be set to min-width?

P.S. using width: 100% kinda works, but I do not want any values inbetween the min and the max. The width should be either min or max and that's it no inbetween.

Upvotes: 0

Views: 944

Answers (2)

Arel Sapir
Arel Sapir

Reputation: 136

mediaQuery

Lets assume min-value is 30px and max-value is 100px and that enough-space is 70px using media query will allow you to define a value if the screen is 70px wide and a different value if the screen is less then that.

for example:

@media (max-width: 70px) {
    .myCssClass {width: 30px;}
}
.myCssClass {width: 100px;}

in this example the width will "allways" be 100px wide unless the screen is 70px wide or less.

Upvotes: 1

Alexander Dimitrov
Alexander Dimitrov

Reputation: 121

Media queries seem to be the answer.

Upvotes: 0

Related Questions