CSSを使用してページ上にHTML要素を簡単に配置するにはどうすればよいですか？

Question

私は、ページの真ん中に直接配置したいフォームがあります。私はこのCSSを持っています

#form { 
     width: 240px; 
     height: 100px 
     margin: 0 auto; 
     display: block; 
     } 

これは水平にしかしません。それを垂直にする方法はありますか？

Answer 1

私が間違っているかもしれないが、私の記憶が正しければ...これは動作するはずです：私が間違っている場合、あなたはおそらくJavaScriptを使用する必要が

#form { 
    width: 240px; 
    height: 100px 
    position: absolute; /* make sure this is wrapped by an element with "position: relative" */ 
    top: 50%; 
    left: 50%; 
    margin: -50px 0 0 -120px; /* half of the height and width */ 
    } 

。

Answer 2

実際には、ページの上部からオフセットを宣言することはできますが、しばらく考えてみてください...ウェブページはどのくらいの高さですか？垂直にセンタリングされることは何を意味しますか？

開いているブラウザのウィンドウの高さに対して中央に配置しますか？または、ページの高さに合わせて中央に配置します（ブラウザウィンドウのサイズに関係なく、ヘッダーの先頭からフッターの一番下まで）。

プレビューでは、元の投稿のコメントがこれをうまくカバーしています。