28173 sujets

CSS et mise en forme, CSS3

[Résolu]Marge étrange dans mes onglets

Bonjour, j'essaye de mettre en place des onglets mais j'obtiens une marge plus ou moins grande à gauche de mes onglets sous FireFox et Internet Explorer, j'aimerai la supprimer.

J'ai mis en évidence la (ou le?) div "nav" et y ajoutant un fond jaune :

http://i58.photobucket.com/albums/g257/Pingoo78/marge.gif

mon HTML :

<div id="header">

<ul id="nav">
	  <li class="page_item"><a href="http://www.adresse.com" title="Accueil">Accueil</a></li>
	  <li class="page_item"><a href="http://www.adresse.com" title="A propos">A propos</a></li>
</ul>

</div>


mon CSS : 



#header {
	background: #FFFFFF url(images/header.jpg) no-repeat;
	width: 750px;
	height: 217px;
	margin: auto;
	position: relative;
}

#nav {
	list-style: none;
	margin: 0px;
	position: absolute;
	left: 0px;
	bottom: 0px;
	background:#FFFF00;
}
#nav li {
	float: left;
	margin-left: 5px;
}
#nav .current_page_item a, #nav .current_page_item a:visited{
	color: #000000;
	text-decoration: none;
}
#nav .page_item a{
	color: #ffffff;
	text-decoration: none;
	background: #5c8d0c url(images/nav-button-bg.gif) repeat-x;
	padding: 5px 15px;
	font: 14px Arial, Helvetica, sans-serif;
	border-top: 1px solid #E6EED0;
	border-left: 1px solid #AFCD69;
	border-right: 1px solid #AFCD69;
	display: block;
}
#nav .page_item a:hover {
	color: #000000;
}


Merci de votre aide!
Modifié par MasterPingouin (26 May 2007 - 14:42)
Salut,

Effectivement avec padding: 0 sur la liste ça devrait marcher.

Un petit conseil : Commence toujours tes CSS avec


*
{
    margin: 0;
    padding: 0;
}


Ca évite parfois quelques surprises sur les différents navigateurs...
Modifié par predator93 (22 May 2007 - 14:49)
predator93 a écrit :
Un petit conseil : Commence toujours tes CSS avec

*
{
    margin: 0;
    padding: 0;
}

A manier avec précaution, tout de même. Notamment parce que ça nécessite ensuite de réécrire intégralement les styles par défaut du navigateur... Ce qui demande du temps, et beaucoup de patience pour les contrôles de formulaires.
Merci beaucoup, grâce à vous, je n'ai plus de marge indésirable sous FF. Par contre, celle d'IE6 n'à pas disparu, pourtant j'ai ajouté dans " #nav " padding= 0px;

Finalement, ce n'est pas grave, la différence et minime -> Résolu
Modifié par MasterPingouin (26 May 2007 - 14:42)
Sujet clos
Aller à