Как инициализировать ширину div и изменить его автоматически после добавления некоторого содержимого в CSS?

Question

У меня есть div, я хочу инициализировать ширину, например, 100px после помещения некоторого содержимого, оно должно автоматически изменить ширину. Возможно ли это в чистом CSS? или я должен использовать JavaScript?

<div></div>

<style>

div{
    min-height: 100px;
    min-width: 100px;
    background-color: red;
}

<style>

Я уже использую минимальную ширину, она не работает, она делает ширину 100%. Заранее спасибо

Answer 1

CSS достаточно для достижения этого. То, что вам не хватает, это display: inline-block;.

div {
  background-color: #f00;
  display: inline-block;
  min-height: 20px;
  min-width: 100px;
}

<div></div>