0

要素を中央に配置しようとしています。要素の幅が変わる可能性があるため、 の CSS メソッドを使用できませんmargin: 0 auto。

これが私のコードです：

$.fn.center = function() {
    $(this).css({
        'margin-left': ($(this).parent().innerWidth() - $(this).outerWidth()) / 2  + "px",
        'margin-right': ($(this).parent().innerWidth() - $(this).outerWidth()) + ($(this).outerWidth() / 2)  + "px"
    });   
};
$('#nav').center();

残念ながら、これは機能していません。理由を理解するのを手伝ってもらえますか? 絶対配置を使用する必要がありますか?

ありがとう。

4

4 に答える 4

2

このすべての必要はありません..

サブ要素 ( li) をインライン ブロックにするため、コンテナー#navを に設定するだけtext-align:centerです。

マージンをまったく設定しないでください。

于 2012-05-13T17:43:12.217 に答える
1

要素position:absolute;を配置してから、式を使用して左の位置を設定できます。もう 1 つの方法は、要素を配置しposition:relative;、 を使用しouterWidthて要素の幅を設定し、次のように配置します。margin:0 auto;

于 2012-05-13T17:43:47.610 に答える
0

それはうまくいくかもしれません：

var space = ($(this).parent().width() - $(this).width) / 2;

$(this).css({marginLeft : space , marginRight : space});
于 2012-05-13T17:39:15.240 に答える
0

最近使用した「game」の ID を持つ div 内に含まれる「gameCanvas」の ID を持つキャンバス要素を中央に配置するには、次のようにします。

$('#gameCanvas').css('margin-left', ($('#game').width() - $('#gameCanvas').width()) / 2);

したがって、コンテナー ID がわかっている場合は、「#gameCanvas」をコンテナー ID に、「#game」をコンテナー ID に置き換えthisます。

于 2012-05-13T17:41:06.350 に答える