0

レイアウトで奇妙な問題が発生しました。ウィンドウ全体では問題なく表示されますが、ウィンドウのサイズを変更すると右にシフトし始めます。

要件は、3つのフルハイトカラムを用意することです。そのうちの2つは固定幅で、もう1つは残りのスペースを占めます。

私はこのように見えるhtmlを制御できません：

<div id="wrapper">
  <div id="main">

     <div id="nav">
     </div>

     <div id="container">
       <div id="content">
       </div>
       <div id="sidebar">
       </div> 
     </div>        
  </div>
</div>

私は、負のマージンと相対的な配置を使用してこれらすべてを行う方法を思いつきました。ウィンドウが非常に小さい場合、コンテンツ全体が右にシフトすることを除いて、正常に機能します。これを防ぐ簡単な解決策はありますか？私はこれに頭を悩ませることができないので、なぜこれが起こるのか知りたいです。

JSFIDDLE：

http://jsfiddle.net/u5yJd/

4

1 に答える 1

1

CSSの2つの修正：

  • #wrapper核兵器とmargin-leftセットleft: 0px;
  • #main追加時にleft: 264px;

それらの変更だけでフィドルを修正しました。

あなた#wrapperはウィンドウの左側にかなり離れていて、あなたはあなた#wrapper（この場合）をウィンドウに入れたいと思っています。そうしないと、ウィンドウに対するポジショニングが少しファンキーになります。

于 2012-11-11T00:44:33.397 に答える