28220 sujets

CSS et mise en forme, CSS3

Re bonjour...

Je reviens assez vite vers vous, car j'ai pu finir mon menu correctement, mais j'ai un énorme soucis quand à la finalité de l'affichage sur IE.

Voici l'adresse : http://perso.wanadoo.fr/mikachu/test/index.htm

La page a passé le W3C validator avec succès.

testé sur Firefox et Netscape ca marche parfaitement.
IE n'est capable quand à lui que de m'afficher une page blanche...

Si vous avez une explication, je l'attends bien volontier.

Merci par avance.
Modifié par Mikachu (30 Jul 2006 - 23:56)
Ceci est corrigé, mais IE ne respecte en rien ma feuille de style.
Il n'affiche pas mon image BG répétée jusqu'en bas de navigateur, et ne respecte pas le positionnement de mes liens du menu (voir sur Firefox ou Netscape) pour la mise en page voulue).

Que faire pour qu'IE respecte cette feuille de style, je croyais ce procédé universel moi ? Smiley sweatdrop

Je remet le lien :
http://perso.wanadoo.fr/mikachu/test/index.htm

Merci par avance.
pas de soucis, c'est tout à fait normal que IE te donne du fil à retordre... voila un début d'explication Pour le cas de ton site, essaie ça...
div.menu {
        z-index: 100;
        position: relative;
            top: 0px;
            left: 0;
            width: 124px;
            height: 563px;
        border: 1px dotted black;
        background-color: transparent;
        background-image: url('fondmenu.gif');
        background-repeat: no-repeat;
}
#menu0 {
        font-size: 11px;
        position: absolute;
            top: 9px;
            left: 20px;
}

#menu1 {
        position: absolute;
            top: 115px;
            left: 10px;
}

chez moi ça marche en tout cas... tu mets ta div menu en position relative, et tu places tes élèments à l'intérieur en position absolue...
Modifié par p_tite_jo (14 Oct 2005 - 11:17)
Bonjour,

Merci bien du conseil, j'ai pu corriger, mon menu. Je vais relire un peu plus d'info sur la position relative ou absolute pour mieux comprendre pourquoi ca fonctionne mieux comme ca.

Par contre en ce qui concerne la répétition du fondbg, il s'opère toujours bien sur firefox et netscape, mais il est inexistant sur IE. J'ai bien essayé de modifier les paramètres de ma div.fond mais rien n'y fait.

Merci d'avance
sans garantie: essaie de remplacer dans ta div fond, fixed par absolute... (m'étonne que ça marche, mais qui ne tente rien n'a rien Smiley confus )
c'est bien ce que je pensais, ça ne marche pas. en revanche tu devrais t'en sortir avec ça...
div.fond {
        z-index: 1;
        padding-top: 563px;
        width: 124px;
        height: 100%;
        background-image: url("ton image");
        min-height:100%; /*ie ecrase la ligne precedente, mais l'interprete comme un min-height */
        height:auto!important;    /*cette ligne ne sera pas ecrasé par la suivante dans firefox et garde 
donc le block etirable en hauteur */


}

Modifié par p_tite_jo (14 Oct 2005 - 14:07)
Encore merci, ca marche bien et ca me permet de faire apparaitre mon BG en fond.

Par contre l'attribut semble lui imposer de faire descendre la page encore plus bas dans le nabigateur, et ca me crée une barre de défilement superflu (sur TOUS les navigateurs) que j'aimerai supprimer... Mais je ne sais pas comment.

Merci encore d'avance.

http://perso.wanadoo.fr/mikachu/test/index.htm
Modifié par Mikachu (14 Oct 2005 - 14:50)
en effet, c'est assez inutile.. le problème vient du padding-top... maintenant si tu l'enlèves t'as plus d image qui se répéte... sur mon site ça marche parce que dessous, j'ai une div qui "met fin à la répétition".. maintenant dans ton cas, j'avoue que j'ai pas la moindre d'idée de l'astuce à utiliser.. j suis une débutante en standarts aussi.. faudrait qu'un "spécialiste" passe par ici.. il aurait surement qqch de plus futé à te proposer... Smiley cligne
Je ne sais pas si tu débute, mais tu en connais déja plus que moi Smiley cligne
Merci en tout cas de t'être penché sur mon cas.

C'est vraiment passionnant, mais quelque peu déroutant de voir des exemples pris sur d'autres sites qui ne fonctionnent pas si je les appliques sur le mien... enfin ca viendra !

Vivement le passage du spécialiste pour m'aider dans ma tâche.
J'ai fini par trouver la solution, elle était toute bête, et me supprime un div inutile.

au lieu de mettre mon fond répété dans un div, qui s'étendait au dela de la hauteur du navigateur (même en 1600*1200) et qui m'imposait une barre de défilement.

Je l'ai tout simplement inséré au body avec le paramètre repeat-y

Merci encore pour votre aide