2012-03-23 7 views
3

私は現在、このようなものがあります。一部、ブラウザのウィンドウが(以上1000pxワイド)十分な大きさであるとき負のマージンとスクロールバー

<div class = "className" style = "position: absolute; left: 50%; margin-left: -500px;" > 

これはうまく動作しますが、私は小さい幅にサイズを変更するときdivのオーバーフローが左側になり、スクロールバーがオーバーフロー領域をカバーしません。 Firefox、Chrome、IE8で試したところ、すべて同じ症状になりました。これをどうすれば解決できますか? デモ:http://pastehtml.com/view/bsanetaio.html(ブラウザウィンドウのサイズを1000pxより小さくして問題を確認してください)。

+1

期待される結果は何ですか?実例がありますか、「うまくいかない」ということを解読するのは難しいです。 – Kyle

+0

ネガティブマージンは悪い考えであり、可能な限り避けるべきです。もっとうまくいくためには、さらに詳しい情報が必要でしょうか? – Liam

+0

これはなぜですか? – Joseph

答えて

1

これは、望ましい効果を達成するはずです。内側のdivは絶対位置を持たないことに注意してください。

<div style="position: absolute; left:50%"> 
    <div style="width: 1000px; margin-left: -500px;"> 

    </div> 
</div> 

あなたがしようとしていることを行うには良い方法があるかもしれません。

+0

これは依然として同じオーバーフロー動作を引き起こしています。デモをご覧ください。 – Chris

+1

同じ結果を得るための[別の方法](http://uoco.net/d/dev/center_blocks.html)はこちらです。必要に応じて、floatの代わりに 'display:inline-block'を使うことができます。 – diolemo

+0

これはちょうどいいです、ありがとう:D – Chris

0

margin:0 autoを中心にコンテンツを使用することをお勧めします。 絶対

+0

私はコンテンツを中心にしようとしていません、時間があればデモを見てください!ありがとう:D – Chris

関連する問題