0

所以我遇到的问题是我有多个 div 都应用了相同的类（“文本”）我没有为这些 div 设置宽度或高度，并允许它们自动调整为文本的大小在其中（当然宽度不同）。不幸的是，当我这样做时，任何其他使用我相同的“文本”类的 div 都会占用其中包含最多文本的 div 的宽度。有没有办法使用 CSS 或 Javascript 自动调整每个 Div 的宽度到它们内部的特定文本？（无需手动指定每个 div 的宽度）。

CSS

.Text{
   background-color: teal;
   padding: 7px;
   margin: auto;
}

HTML

<div class="Text">
     <h1>This is Some Text</h1>
</div>

<br />

<div class="Text">
     <h1>This is More Text only longer than the first</h1>
</div>
4

1 回答 1

2

DIV标签的默认 CSS是display: block, position: static;. 这使得DIV标签占据了其容器的整个宽度。在您的情况下，容器足够宽以包含最长的DIV，并且所有DIVs 都占用了该空间。

为了解决这个问题，你可以像这样设置你的 CSS：

.Text{
   display: inline-block;
   background-color: teal;
   padding: 7px;
   margin: auto;
}

您可能需要使用<BR />标签来强制换行，但我看到您已经这样做了。

于 2013-01-12T07:43:41.307 回答