異なる画面解像度でウェブページのアライメントを自動的に設定する方法は？

Question

私はASP.NETでプロジェクトを作っています。解像度は1280x800です。私はウェブページの幅を使用しています1245px私のシステム上で非常にうまく動作していますが、私は、解像度1024x768のサイトを使用しているときに、ブラウザから整列が消えます。私はの解像度でいい探している<div>の幅1245pxを使用しています。
このコードを試しましたが、エラーが出ます。

protected void Page_Load(object sender, EventArgs e) 
    { 
     div1.Style.Add(HtmlTextWriterStyle.Width, System.Windows.Forms.Screen.PrimaryScreen.Bounds.Width.ToString()); 
    } 

それは

は、型または名前空間名「Windowsの」名前空間 「システム」に存在しないというエラーを与えている（あなたは、アセンブリ参照が不足している？） `

これを修正する簡単な方法があります。

Answer 1

あなたが聖杯のために撮影し、液体レイアウト（a **の痛み）を使用しようとしない限り、実際には異なったスクリーン解像度をネイティブに現実的にサポートすることはできません。私はあなたが素晴らしいjavascriptを使用することができると思うが... ... OUCH ...とメンテナンスの悪夢..それはあなたのページをボトムになります。

ウェブサイトは、これまでの画面サイズのうち1024×768の想定されたウィンドウにコンテンツを表示するように設定してください。

これを達成する一般的な方法は、残りの部分が余分な余白になるように、自動余白を使用して1024x768のdivを中央に配置することです。

<div id="MainContainer"> 
My content here 
</div> 

    #MainContainer 
    { 
     width: 1024px; 
     height: 768px; 
     margin: auto; 
    } 

これは、コンテンツを垂直方向にセンタリングする問題を解決しません。私が好むアプローチの1つは、センタリングが要素ではないように絶対配置を使用することです。私はちょうどセットアップページには、代わりにこのCSSを使用して、ウィンドウのサイズに合わせてストレッチすることができます。

#MainContainer 
    { 
     position: absolute; 
     top: 0; 
     bottom: 0; 

     width: 1024px; 
     height: 768px; 
     margin: auto; 
    } 

これはdiv要素は、下にウィンドウの上部からストレッチするようになります。 私はこの解決策が大好きです。なぜなら、ほとんどのブラウザーとそのさまざまなバージョンでサポートされているし、ズームでもかなりうまく処理できるからです。