0

前のコントロール、スライドの開始/停止、次のコントロールを含む div を持つスライダーがあります。

「text-align」をそれぞれ左、中央、右に設定し、表示を「インライン」にします。幅全体を埋める方法がわかりません。

マークアップは次のとおりです。

<div id="external_promo_controls">
  <div id="promo_previous"></div>
  <div id="promo_auto_controls"></div>
  <div id="promo_next"></div>
</div>

そしてCSS：

#external_promo_controls div{
    display: inline;
}
#promo_previous {text-align: left;}
#promo_auto_controls {text-align: center;}
#promo_next {text-align: right;}

フローティング要素でそれを行うことができたと思いますが、要素を1行に配置し、要素を中央に配置する正しい組み合わせを作ろうとすると、かなり混乱しました。最終的に発生するすべてのイベントであるテキスト、フォント、サイズ、またはコンテナーを変更するとすぐに壊れてしまうため、ピクセル値で要素を配置することは避けたいと思います。

4

2 に答える 2

3

フロートを使用するのは簡単です-このフィドルは正しい道にあなたを設定するはずです:

http://jsfiddle.net/Q4paq/

ホバー状態のリンクを含む DIV の新しい例。

http://jsfiddle.net/Q4paq/1/

于 2012-08-27T13:39:38.947 に答える
0

これを試して。うまくいくかどうかはわかりませんが、3つの内側のdivすべてに100pxそれぞれの幅があるとします

outerDivマージンとパディングなしで幅を 300px に指定します

innerDivwidth:100px で、margin と padding は 0px で、float : left です。

マージンとパディングを指定する場合は、3 つすべての innerDiv の合計width + padding + margin + border* 3 が外側の div の幅になります。

于 2012-08-27T13:38:10.370 に答える