html - すべての画面解像度の垂直メニューを中央に配置するにはどうすればよいですか？

Question

すべての画面解像度で垂直ドロップダウンメニューを中央に配置する方法を知っている人はいますか？

私は文字通りすべてを試しました。画面の解像度の高さが長いほど、左に移動するか、右に移動するか、上下に移動します。

メニューの問題：http ：//www.differentregard.com/home.php

CSSコード：http ：//www.differentregard.com/css/homebg.css

Answer 1

私が知っている水平方向と垂直方向の両方で何かを中央に配置する唯一の純粋なCSSの方法では、固定された幅と高さである必要がありますが、次のようになります。

• 絶対に配置し、に設定leftしtopます50%。
• 左マージンをそれぞれ幅と高さの負の半分に設定します。（境界線またはパディングを使用する場合は、半分にする前に幅/高さに追加して、それを考慮する必要があります）

Answer 2

幅を設定し、マージンを与えます：auto;

example{
width: 150px;
margin: auto;
}

jquery

var a = $(window).height() / 2;
var s = $("#di").height() / 2;
$("#di").css("margin-top", a - s)

デモ：フィドル

Answer 3

それがあなたのために働くことを願ってこのことを試してください

#logo{

位置：絶対;

トップ：22％;

幅：100％;

高さ：66px;

text-align：center; }

#nav {

幅：100％;

text-align：center;

位置：絶対;

トップ：40％;

z-index：1;

テキスト装飾：なし;

text-transform：大文字;

font-family：Century Gothic、sans-serif;

色：白;

list-style-type：none;}