1

すべて同じ幅で、いくつかのテキストを含む div の水平行を作成しようとしています。理想的には、異なる数の div で維持/複製するのが難しいため、それらの位置を手動で設定したくありません。これまでの私の 2 つのアプローチは、どちらも満足できるものではありませんでした: 1. 一連の div を使用し、float: left を css に設定します。このようにして、それらはすべて左に配置されます。基本的に、コンテナの幅を均等な間隔で埋めるように正当化されます。2. 一連のスパンを使用し、css で親に text-align: center を設定します。これは正しく正当化されますが、スパン内のテキストの長さはさまざまです。つまり、テキストが少ないものは他のものよりも幅が狭くなっています。

これら 2 つのプロパティをどのように組み合わせることができますか: div の場合は手動で幅を設定する機能ですが、テキスト位置合わせを使用してスパンの場合は位置を中央に設定する機能です。float-child-align のようなプロパティはありますか?

4

2 に答える 2

2

を指定すると、スパンの幅を設定できますdisplay: inline-block。

于 2013-07-04T19:38:09.020 に答える
0

div のマージンとサイズを適切に計算すれば、正しく実行できます。たとえば、次のフィドルを見てください: http://jsfiddle.net/r7KMB/

<div class="container">
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
</div>

.container {
    width : 230px; height:20px;
    border : 1px solid black;
}
.item {
    width: 30px; height: 15px;
    border : 1px solid red;
    margin: 1px 5px 1px 5px;
    display: inline-block;
}
于 2013-07-04T19:46:26.627 に答える