通过文本大小动态调整div的大小

Question

我想知道如何根据文本的宽度调整div的大小，避免浪费空间，使div保持压缩状态。 示例：

Default size

div应该有如下的剪裁：

Desired size

示例代码：

.linhaCodigo{
  background: #C0C0C0;
  position: relative;
}

<div class="conteudo2">
              <h3>Cap 2 - Title</h3>
              <p align="left"><h4 align="left"><b>Title 2:</b></h4>
                textexttexttexttexttexttexttexttexttexttexttexttext
              </p>
              <div class="linhaCodigo"> print("I like it!")<br>
                <b>Outup:</b><br>
                I like it!
              </div><br>
            </div>

Answer 1

尝试

.myclassDiv{
   display: inline-block;
 }

Answer 2

将CSS更改为此：

.linhaCodigo{
  background: #C0C0C0;
  position: relative;
  display: inline-block;
}