[résolu]petits problémes alignement en css sous...IE

[hargnes]

Bonjour
Voila je débute et j'essaye de mettre au point un petit site ...
j'ai un probléme au niveau de mes barres de menus horizontales sous explorer. ...elles se posent en escalier bon a la limite je pourrais m'en moquer mais bon cela n'est pas trés sérieux pour les pauvres visiteurs qui ont encore IE ...
Si quelqu'un avait une idée cela serait trés sympa car la ....j'y arrive pas...
merci

[calimo]

Un menu en escalier ? C'est original ça, dépose vite un brevet avant que quelqu'un te pique l'idée Nooon je rigole

En fait je ne saisis pas vraiment quel effet tu obtiens, et si tu espères avoir une réponse sans le moindre bout de code tu risque d'attendre longtemps

[hargnes]

Ok un peu tête en l'air donc voila le css (juste la partie du menu


a.A {
font-weight:bold ;
text-align: center;
color: #000;
display: block;
border: 1px solid #CCC;
width: 80px;
height: 25px;
line-height: 25px;
font-size: 12px;
float: left;
margin-right: 5px;
background: url('images/boutonblanc.png') left top;
}




/*boutons barre de menu fixes*/

a.Avio {
background: url('images/boutonviolet.png') left top;
}

a.Aind {
background: url('images/boutonindigo.png') left top;
}

a.Able {
background: url('images/boutonbleu.png') left top;
}

a.Aver {
background: url('images/boutonvert.png') left top;
}

a.Ajau {
background: url('images/boutonjaune.png') left top;
}

a.Aora {
background: url('images/boutonorange.png') left top;
}

a.Arou {
background: url('images/boutonrouge.png') left top;
}

/*boutons barre de menu changeants*/

a.A1:hover {
background: url('images/boutonviolet.png') left top;
}
a.A2:hover {
background: url('images/boutonindigo.png') left top;
}
a.A3:hover {
background: url('images/boutonbleu.png') left top;
}
a.A4:hover {
background: url('images/boutonvert.png') left top;
}
a.A5:hover {
background: url('images/boutonjaune.png') left top;
}
a.A6:hover {
background: url('images/boutonorange.png') left top;
}
a.A7:hover {
background: url('images/boutonrouge.png') left top;
}
a.A8:hover {
background: url('images/boutonblanc.png') left top;
}

ul.menu_horizontal, .menu_horizontal li {
list-style: none;}



et la le menu horizontal




<ul class="menu_horizontal centre">
<li><a class="A Avio A8" href="virus.html" title="virus description et prévention" accesskey="11" tabindex="11">VIRUS</a></li>

<li><a class="A Aind A8" href="espions.html" title="Logiciels espions comment s'en protéger" accesskey="12" tabindex="12">ESPIONS</a></li>
<li><a class="A Able A8" href="pirates.html" title=" intrusions... mettre une serrure a votre pc " accesskey="13" tabindex="13">PIRATES</a></li>
<li><a class="A Aver A8" href="failles.html" title="Remédier aux faiblesses ou mauvais réglages de vos logiciels" accesskey="14" tabindex="14">LOGICIELS</a></li>
<li><a class="A Ajau A8" href="pubs.html" title="Parades anti pub.." accesskey="15" tabindex="15">PUBS</a></li>
<li><a class="A Aora A8" href="parents.html" title="Internet et les enfants..." accesskey="16" tabindex="16">PARENTS</a></li>
<li><a class="A Arou A8" href="emails.html" title="Le courrier plus sûr pour soi et ses correspondants" accesskey="17" tabindex="17">EMAILS</a></li>
</ul>

[hargnes]

Je pense que tout y est sinon l'adresse du site est
http://home.tele2.fr/agnesD/
et le css
http://home.tele2.fr/agnesD/style.css
merci encore
Pour le brevet si tu me le remet droit je te laisse le déposer..

[calimo]

Et tu as ça dans un exemple en grandeur nature ? C'est probablement le float: left; qui doit être interprété un peu différemment (peut-être selon le contexte...)

Edit : ah au temps pour moi j'ai encore été trop lent

[calimo]

Vire le prologue XML, IE ne le supporte pas et ça le fait basculer dans le mode "quirk", c'est-à-dire les modes de compatibilité, avec le modèle de boîtes Microsoft (dans lequel les bordures sont comptées dans la taille des boites) et d'autres comportements "bizarres" utilisés pour conserver une compatibilité avec les pages mal codées.

Quand tu fais une page la première chose c'est de t'assurer que tous les navigateurs l'interpréteront dans le même mode, de préférence celui dit de "respect des standards", le XHTML 1.0 strict est une idée mais alors pas de prologue XML

PS : un peu de lecture : http://www.alsacreations.com/blog/index ... avigateurs

[hargnes]

c'est quoi le prologue xml....
çà ? <?xml version="1.0"?>
car sans ça c'est pareil
ou alors c'est autre chose...

[calimo]

Oui c'est ça et ça m'étonnerait qu'il n'y ait aucune différence

[hargnes]

Ben je vois pas trop la différence j'ai même supprimé des boutons au cas ou mais c'est idem.....j'ai aussi enlevé toute la partie xml avec doctype et pareil....

[calimo]

Ah ben évidemment si tu enlèves le doctype aussi ça retombe en mode de compatibilité (quirk)

Sinon je vois pas, à part peut-être le bug des doubles-padding d'IE ? Tu as des padding ? Il y a une condition dans laquelle il compte double mais je ne sais plus exactement laquelle...

Edit : http://www.quirksmode.org/bugreports/ar ... float.html
Vérifie si c'est pas ça...

[Invité]

bon le truc c'est que je suis trés débutante donc tes liens sont un peu trop au dessus de mon niveau je comprends plus ou moins mais ne vois pas trop comment faire.Par contre j'ai trouvé un truc j'ai enlevé la "présentation en liste" et j'ai juste laisse les liens tels quels et rajouté un truc pour centrer le tout ;je perds le phénoméne d'escalier sous IE .Par contre le centrage passe sous firefox mais pas sous IE ...je sais pas si c'est trés clean ...mais c'est mieux . Il y as peut être des bugs dans la gestion des listes sous IE ???
En tout cas je te remercie de ton aide et passe une bonne soirée
vous êtes vraiment super sur ce site

[hargnes]

l'invité c'était moi