私は私の人生のために解決できる非常に奇妙な問題を抱えています。基本的に、Safari では、私のトップ ナビゲーションにはトップ マージンがなく、ページの最上部と同じ高さになっています。Firefoxでは、理由がわかりませんが、上部にも下部マージンが適用されています。firebug でマージンを削除すると、偽の上部マージンも削除されます。
どうか、firefox のページに移動して、私の言いたいことを確認してください。firebug がある場合は、#main-navigation の margin プロパティを無効にすると、何が起こっているかがわかります。
編集: サイトへのリンクを含めるのを忘れた:リンク
コードは次のとおりです。
<body>
<div id="page-wrap">
<ul id="main-navigation">
<li><a href="/" id="home-link<?php if (is_home()) { echo '-active'; } ?>" class="main-nav-link">Home</a></li>
<li><a href="/is" id="about-link<?php if (is_page("About")) { echo '-active'; } ?>" class="main-nav-link">About</a></li>
<li><a href="/discusses" id="articles-link<?php if (is_page("Articles")) { echo '-active'; } if (is_single()) { if (in_category( 3, $post->ID )){ echo '-active'; } } ?>" class="main-nav-link">Articles</a></li>
<li><a href="/does" id="portfolio-link<?php if (is_page("Portfolio")) { echo '-active'; } if (is_single()) { if (in_category( 4, $post->ID )){ echo '-active'; } } ?>" class="main-nav-link">Portfolio</a></li>
<li><a href="/listens" id="contact-link<?php if (is_page("Contact")) { echo '-active'; } ?>" class="main-nav-link">Contact</a></li>
<li><a href="/rss" id="feeds-link" class="main-nav-link">Feeds</a></li>
<div class="clear"></div>
</ul>
そしてCSS:
body {
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Trebuchet, sans-serif; font-size: 13px; color: #2a2a2a;
border-top: 4px solid #f2f2f2;
}
#page-wrap { width: 600px; margin: 0 auto; }
#main-navigation { display: block; position:relative; clear: both; margin: 0 -10px 48px -10px; }
#main-navigation li { float: left; height: 30px; }
#main-navigation li a { display: block; cursor: pointer; margin-right: 28px; height: 30px; text-indent: -9999px; background: url(/images/storminkSprite.png) no-repeat; background-color: transparent; }
私は本当にもう何をすべきか分かりません.私は一日中この問題を解決しようとしてきました.私は完全にアイデアがありません.誰かが助けてくれることを本当に願っています.