[CSS] IE6 & Inverted Sliding Doors tabs

[Membre supprimé 2]

Bonjour à tous,

J'ai réalisé un site valide Xhtml / Css, sans aucun problème sous Firefox, Safari, Opéra, Shiira et Camino.

Cependant, gros problème avec IE6 concernant les tabs du menu principal.

J'ai utilisé la méthode suivante: Inverted Sliding Doors tabs, et simplement modifié le width et le margin-top du nav.

J'avoue que je sèche, si vous avez une idée, je suis preneur.

Merci.

 

[Anonyme]

J'ai vu que tu utilisais un frameset pour ta mise en page (pourquoi ). Le problème que j'ai vu c'est que ce frameset a un mauvais DOCTYPE (généré par dreamweaver? ) comme ta page de base est en xhtml transitionnal il faut utiliser un DOCTYPE frameset xhtml. Il est possible que IE s'emmêle les pinceaux à ce niveau (ou autre chose mais là je n'ai pas trop le temps) et passe en mode quirks.


P.S. : je vois pas trop l'utilité des frames, je les supprimerais ça ne pose que des problèmes.

 

[Membre supprimé 2]

Merci gloup gloup, ce n'est pas lié au frame qu'applique mon registrar (il fait simplement une redirection). A terme, je vais abandonner cette redirection et faire pointer ce nom de domaine vers une IP de serveur mutli-domaines. Le site original est ici, utilise un doctype xhtml transitional et le problème persiste. Ce problème d'incompabilité concerne IE6 donc n'est pas lié avec le mode quirks. Je te remercie pour ton article, si tu as une autre idée, je suis preneur.

 

[Anonyme]

Je crois savoir, c'est un bug de IE avec les images... Essaye d'ajouter display: inline à ta feuille de style :

#header {
    margin:0 0 0 0;
    padding:0 0 0 0;
    height:179px;
    background-color:#ffffff;
    border:1px solid #cccccc;
}

[B] #header img{
    display: inline;
}[/B]

Mais personnellement je ne ferais pas comme ça, mais plutôt ceci avec comme code dans la page d'accueil :

    <h1 id="header" class="accueil">Hotel le Guest House/accueil</h1>

Dans la page chambres :

    <h1 id="header" class="chambres">Hotel le Guest House/chambres</h1>

Etc...

Avec dans la feuille de style :

h1#header {
/*mettre les infos pour les fontes*/
     margin:0 0 0 0;
     padding:0 0 0 0;
     height:179px;
     background-color:#ffffff;
     border:1px solid #cccccc;
}

h1.accueil{
    background-image: url(img/header/b1.jpg);
}

h1.chambres{
    background-image: url(img/header/b2.jpg);
}

P.S. : l'onglet «contact» passe à la ligne suivante sur Firefox et IE windows.

P.S. 2 : très joli :zen:

 

[fredmac75]

Salut,
étant à mon domicile, et donc sur mac, je regarderais tes pages sur IE au boulot... C'et-à-dire pas avant lundi.

Quelques remarques néanmoins :

- Tu démarres avec un H2... où est passé le h1 ?

- dans ta div "Footer", pourquoi ne pas utiliser un liste <ol> ou <ul> ?

- Ton menu est dans un div "nav" ; sachant que <ul> est une balise de type block et compte tenu de la nature des attributs de "nav" tu pourrais facilement éliminer la div en tant que conteneur (remarque qui s'applique également au footer).

- Pourquoi coupler l'attribut float avec l'attribut position:relative ?

float:right; position:relative; top:7px; left:0;

- La nature et la hierarchisation des informations me semble bizarre : pourquoi annoncer les coupures d'électricité et les modalités de réglement en info number one sur ta page "Chambres" ?

- Enfin, une appréciation personnelle : je trouve que ton vert "kakadoi" n'est pas du meilleur effet au prorata des images en tétière :siffle:


J'arrête de t'embêter, et te souhaite du courage.