0

jsフィドル

ハンドルバーで作成された div の選択があります (上記のリンク)。div のスタイリングでは、ハンドルバーでレンダリングされたときにマージンやパディングはまだありません。div 間にギャップがあり、そこに入れたくありません。アドバイスをお願いします。

     <div id='vehicles' class='wrapper'>
         <div class='divd'>&nbsp</div>
            {{#each this}}
               <div id='{{group}}' title='Driver Details' class='divd {{group}}' >
               {{trailer}} 
               </div>
            {{/each}}
         </div>
     </div>
4

3 に答える 3

1

あなたのスタイルは、それぞれが であることを要求.divdしますdisplay: inline-block。これにより、タグの周囲の空白に関して、通常のインライン要素 (プレーン テキストなど) と同じように動作します。プレーン テキストでマークアップにスペースがあると、ページ上のスペースにつながるのと同じように、ここでそれを取得します。これを修正する 1 つの可能な方法はfont-size: 0、親で設定することです。これにより、親コンテナーでそのスペースがゼロになります。ただし、子に a を追加し直す必要がfont-sizeあります。

http://jsfiddle.net/F6JE7/

于 2013-03-13T18:10:32.597 に答える
1

Usinginline-blockは s の周りの空白を使用しますdiv(これはハンドルバーとは関係ありません)。

親要素font-sizeを 0 に設定してfont-sizeから、 をdiv直接設定します。

.wrapper {
    font-size: 0;
}

.divd { 
    display: inline-block;
    width: 50px;
    height: 50px;   
    font-size: 14px;
}

これがあなたのフィドルです：http://jsfiddle.net/fz2Hv/

于 2013-03-13T18:08:26.543 に答える
1

そのためですdisplay:inline-block。div から div への HTML 間のスペースを削除する必要があります。

</div><div id="NewDiv">

それ以外の

</div>
<div id="NewDiv">

大雑把な例ですが、私の言いたいことはわかります。

于 2013-03-13T18:08:42.437 に答える