3

私は、ナビゲーションにMenubar プラグインを使用して WordPress サイトで作業している CSS 初心者です。<ul>配色、センタリング、フォントなどの CSS を変更することはできましたが、メニューの を囲む div の下部に 6 ピクセルが余分にある理由を一生理解できません。いくつかの場所でマージンを 0 に設定しようとしましたが、line-height... を変更しても何も機能しません。

ここに画像の説明を入力

サイトはこちらからご覧いただけます。私が使用しているテーマは、Twenty Eleven の子です。これが（私が思うに）重要なCSSです：

#access div {
    margin: 0 0 0 0;
}
#access {
    background: #773736; 
    clear: both;
    display: block;
    margin: 0 auto; 
    width: 100%;
    text-align: center;
}
#access ul {
    font-size: 13px;
    list-style: none;
    margin: 0 0 0 -0.8125em;
    padding-left: 0;
    display: inline-block;
    font-weight: normal;
}
#access li {
    float: left;
    position: relative;
    text-align: left;
}
#access a {
    color: #eee;
    display: inline-block;
    line-height: 3.333em;
    padding: 0 1.2125em;
    text-decoration: none;
    font-weight: normal;
}

この余分な高さを取り除くにはどうすればよいですか?

4

2 に答える 2

9

それがline-height問題であることがわかりました：

#access {
background: #773736;
clear: both;
display: block;
margin: 0 auto;
width: 100%;
text-align: center;
line-height: 12px;/*this fixes it*/
}

また、1.625 の body から行の高さを継承していたことも指摘する必要があります (ここでは単位である必要があります)。

于 2013-03-27T16:44:15.153 に答える
0

闇に突き刺す…

#access a {
   color: #eee;
   display: inline-block;
   line-height: 3.333em; <-- this might be causing it
   padding: 0 1.2125em;
   text-decoration: none;
   font-weight: normal;
}
于 2013-03-27T16:42:27.397 に答える