Je rencontre un problème très étrange que pour la vie de moi je peux résoudre. Fondamentalement, dans Safari ma navigation haut n'a pas de marge supérieure et est au même niveau que le haut de la page. Dans Firefox, il applique également la marge inférieure au sommet, pour une raison que je ne peux pas comprendre. Lorsque je supprime la marge dans Firebug, la fausse marge supérieure est également supprimée.Marge n'agissant pas correctement dans Firefox
S'il vous plaît, allez à la page dans firefox pour voir ce que je veux dire. Si vous avez firebug, désactivez la propriété margin sur # main-navigation et vous verrez ce qui se passe.
EDIT: Vous avez oublié d'inclure lien vers le site: Link
Voici le code:
<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>
Et le 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; }
Je ne sais vraiment pas quoi faire, J'ai essayé de résoudre ce problème toute la journée et je suis complètement à court d'idées, alors j'espère vraiment que quelqu'un pourra m'aider.
Avez-vous simplement pas collé le reste ou vous avez votre code se terminant comme ça? – freiksenet