28173 sujets

CSS et mise en forme, CSS3

Bug de marges avec IE

Bonjour à tous,

j'ai un bug curieux avec IE, voyez la page suivante, c'est une maquette en construction d'un site.

Là, j'ai mis des bordures de partout, tout va bien, rendus identiques sous Firefox, IE, Opera, Safari.

Si j'enlève la bordure à #navigation (celle qui est verte), no problemo sous Firefox, Opera et Safari, mais IE me décale le premier lien vers le haut, comme s'il n'y avait plus de margin-top.

Quelqu'un a une solution ?
Merci à ceux qui répondront !

P.S : J'ai bien la solution d'utiliser une bordure-top de la même couleur que le fond, mais c'est un peu minable, et surtout ça ne marchera pas dans certains cas.
Salut,

Un problème de fusion des marges, ta solution n'est pas "minable" sinon overflow; auto pour le bloc incriminé fonctionne aussi selon ton contexte.
ghost a écrit :
Salut,

Un problème de fusion des marges, ta solution n'est pas "minable" sinon overflow; auto pour le bloc incriminé fonctionne aussi selon ton contexte.


J'ai essayé overflow:auto; mais ça ne semble pas fonctionner. Smiley bawling
Salut,

Pour IE7 ça fonctionne mais pas pour ie6 là tu cumules avec un problème de Haslayout, vu ton contexte tu ne peux pas utiliser width : 100% ou height: 1%, donc essayes en rajoutant zoom: 1 pour ie6 
#navigation{
font-size:170%;
text-align:left;
margin:0 0 0 30px;
padding:0;
overflow: auto;
zoom: 1;
list-style-type:none;
/* solution minable => une bordure de la même couleur que le fond 
border-top:1px solid #ded9d6;*/
}


Mais gare à la validation ...
Effectivement, ça fonctionne, mais ça ne passe pas à la validation... Smiley bawling

Du coup, je crois que je vais "bordurer" en dépit de cause...
Modérateur
Salut,

Tu peux mettre le zoom: 1 dans un fichier à part en commentaire conditionnel pour IE6 (c'est même recommandé), ce qui te permettra de conserver ta feuille de style globale valide.
Modifié par koala64 (05 Oct 2007 - 11:00)
Je plussoie koala64, le principe est un code de ce genre :


<!--[if lte IE 6]> 
	<link rel="stylesheet" href="css/ielte6.css" type="text/css">
<![endif]-->


Qui ne chargera la feuille de style que pour ie6 et moins

Edit : Cite mon message pour voir le code que j'ai voulu marquer, les mises en forme automatique du forum ayant fait leur office entre temps...
Modifié par Tymlis (05 Oct 2007 - 12:00)
Sujet clos
Aller à