0

私はjqueryを介して別のdivに動的に挿入されているdivを持っています

これはjQueryです:

$('#portSecW div:not(".closeXbtn")').prepend('<div class="portSecRollOver"><div class="portSecInner"></div></div>');

これは通常のHTMLです。

<div class="portThumbsL">
<a href="images/sitePortThumbs/2882.png"><img src="images/sitePortThumbs/2882.png" alt="2882films"/></a>
<div class="thumbTxtSmall">2882FILMS</div>

最終的な出力はこれです

<div class="portThumbsL">
<div class="portSecRollOver"><div class="portSecInner"></div></div>
<a href="images/sitePortThumbs/2882.png"><img src="images/sitePortThumbs/2882.png" alt="2882films"/></a>
<div class="thumbTxtSmall">2882FILMS</div>

これを行うと、ロールオーバー効果をアニメーション化できます。たとえば、portSecInnerの途中で、他の動的コンテンツが挿入されます...(テキストのみ).portSecInnerの親はportSecRollOverであり、絶対に配置されます。

だから私が持っている問題は、CSSで私が単純なものを持っているということです

.portSecInner{ margin:0px auto !important;}

しかし、それはそれを中央に配置しません...それを動かすことさえしません。たとえば、手動でターゲットを設定すると(マージン:10px 20px)、移動しますが、明らかにすべてが中央に配置されるわけではありません。

これを修正し、この赤ちゃんを中心に置くために私ができることについてのアイデアはありますか?

4

2 に答える 2

1

の終了タグが<div class="portThumbsL">ありません。これを閉じて試してください。

margin:0autoが機能していると思います。このデモを確認してくださいhttp://jsfiddle.net/85s4j/1/

の幅を固定したくない場合は、divを親divの中心に配置できるようにをportSecInner追加しますmargin:0 25px;

于 2012-09-12T10:43:06.230 に答える
1

margin: 0 autowidth次のように、要素とその親にを設定した後にのみ機能します。

.portSecRollOver {
    width: 300px;
}
.portSecInner {
    width: 200px;
    margin: 0 auto;
}
于 2012-09-12T11:12:59.857 に答える