Как сделать ширину по содержимому css

Для того чтобы установить ширину блока по содержимому (для текстового контента, например), можно использовать свойство display: inline-block. С таким значением свойства display блок будет занимать только необходимую для контента ширину.

Пример кода CSS для установки ширины блока по содержимому:

.container {
  display: inline-block;
}

Если вы хотите установить ширину не для тектового элемента, а для блока с другим типом контента (например, изображение), то можете использовать свойство max-width, которое ограничивает максимальную ширину элемента.

Пример кода CSS для установки максимальной ширины блока по содержимому:

.container {
  max-width: max-content;
}

Также можно использовать свойство width: fit-content, которое установит ширину блока по максимальной ширине содержимого.

Пример кода CSS для установки ширины блока по максимальной ширине содержимого:

.container {
  width: fit-content;
}

Заметьте, что поддержка свойства fit-content не полностью распространена, поэтому убедитесь, что ваша целевая аудитория использует браузеры с поддержкой этого свойства.