14

ここでの合計n00bの質問(少なくともCSSエリートにとって):

display: block;との両方を持つ要素がその親widthのプロパティと一致していないように見えるのはなぜですか?text-alignつまり、常に左を維持することを主張しているようです。

これが問題を説明するjsFiddleです。

明らかに、これはCSS仕様と一致している必要があります(つまり、Chrome、Firefox、Operaがすべて同意している場合、私はほとんど疑いがありません)。よくわかりません。

4

4 に答える 4

16

テキストは150pxのボックスのすぐ内側に配置されます。それは正しいです。ブロック要素は、親のtext-alignに揃えられません。

これを修正するには、display: inline-blockまたはfloat: right.widthdivで使用する必要があります。

clear: right編集:floatを使用して、前のdivと同じ行にないように追加します

于 2012-05-07T23:50:02.353 に答える
1

<span>は。を持つ要素display: inlineです。display: inlineテキストの配置に従う要素。display: blockテキストの配置に従わない要素は、floatによってOWNEDに配置されます。

要素の幅を変更するだけでは、テキストの配置に従ってインラインのままになりますが、表示をブロックして幅を変更すると、コンテンツはテキストの配置を想定しますが、要素は想定しません。私はあなたのコードでこれをいくつかの色で説明しようとしました;)

http://jsfiddle.net/Z6Twf/3/

于 2012-05-07T23:58:08.963 に答える
0

これは、クラスが幅ではなくブロック幅であるためです。クラスの名前をblock_widthに変更してから、cssで最後のクラスを.widthではなく.block_widthにして、機能します

于 2012-05-07T23:49:22.600 に答える
0

別の方法

<div style="text-align:right; margin:0px auto 0px auto;">
<p> Hello </p>
</div>
  <div style="">
<p> Hello </p>
</div>
于 2018-04-23T09:17:37.740 に答える