min/max width/height with multiple values

Question

Edit in 2020 (min, max, clamp functions)

To anyone who get here by search engines:

CSS min / max / clamp functions had got some supports in recent (2020) bro

Answer 1

You cannot set max-width to both 200px and 50%. You could put the element in another element with max-width of 400px:

    
Text here



#parent {
    background-color: red;
    max-width: 400px;
}
#child {
    background-color: green;
    max-width: 50%;
}