Минимальная/максимальная ширина/высота с несколькими значениями ⇐ CSS

[Anonymous]

Редактировать в 2020 году (функции min, max, Clamp)Всем, кто попал сюда через поисковые системы:
Функции min/max/clamp CSS получили некоторую поддержку в последних браузерах (2020 г.). Вы можете попробовать максимальную ширину: min(200px, 50%);. Вы можете взглянуть на эти функции CSS, но будьте осторожны с проблемами совместимости.

Изменить в 2023 году (контейнерные запросы)
Контейнерные запросы поддерживались Chrome 105, Firefox 110 и iOS 16.

Исходное сообщение:
Я хочу ограничить ширину не более 50 %, и не более 200 пикселей.
Это означает, что если 50 % меньше 200 пикселей, оно должно вести себя так же, как max-width: 50%, в противном случае его поведение станет max-width: 200 px.
Как могу ли я определить это с помощью CSS?

(без функции min, которая еще не поддерживается)

Код: Выделить всё

.some_element {
background: red;
float: left;
width: auto;
max-width: 200px;
max-width: 50%;
/* this will override previous one, but i want both of them work */
}

Код: Выделить всё

Text here

Подробнее здесь: https://stackoverflow.com/questions/305 ... ple-values