0

したがって、私が抱えている問題は、同じクラスが適用された複数のDiv（「テキスト」）があることです。これらのdivに幅や高さを設定しておらず、テキストに合わせて自動サイズ変更できるようにしています。それらの中にあります（もちろん幅はさまざまです）。残念ながら、これを行うと、同じ「Text」クラスを使用する他のdivは、その中に最も多くのTextがある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あり、すべてDIVのがそのスペースを占めています。

これを修正するには、CSSを次のように設定します。

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

<BR />新しい行を強制するためにタグを使用する必要があるかもしれませんが、すでにそれを行っているようです。

于 2013-01-12T07:43:41.307 に答える