1

HTML：

<div id="header">
    <div id="logo" class="block"><h1>Logo place</h1></div>
    <div id="navigation" class="block">
        <ul>
            <li><a href="index.html" class="current"><span class="meta">Homepage</span><br />Home</a></li>
            <li><a href="about.html"><span class="meta">Who are we?</span><br />About</a></li>
            <li><a href="contact.html"><span class="meta">Get in touch</span><br />Contact Us</a></li>
        </ul>
    </div>
</div>

CSS：

#header .block{
    padding: 5px;
    display: inline-block;
    vertical-align: top;
}

#header #logo{
    float: left;
    vertical-align: middle;
}

#header #navigation{
    float: right;
    vertical-align: top;
}

#navigation li{
    display: inline-block;
}
#navigation li a {
    font-family:arial,sans-serif !important;
    display:block;
    padding:44px 0 0;
    text-decoration:none;
    color:#000000;
    font-size:14px;
    font-weight:bold;
}

http://jsfiddle.net/nonamez/gGrrm/

ここに画像の説明を入力してください

だから、私はdivを少し拾う必要があります。それはロゴとほぼ同じレベルになるでしょう。必要に応じて、が存在する可能性がありheightます。誰かが私の問題についていくつかの手がかりを提供できるかもしれませんか？

4

2 に答える 2

3

メニューが一番上にない理由は

#navigation li a

パディングがあります：

padding:44px 0 0;

したがって、この行を次のように変更して、適切に配置します。

padding:0;
于 2013-01-12T01:16:03.200 に答える
0

position：relativeを使用しないのはなぜですか。下：20px;

あなたが探しているどんな結果に対してもこのような何か...

http://www.w3schools.com/cssref/tryit.asp?filename=trycss_position_relative

于 2013-01-12T01:16:21.277 に答える