Bonjour,
Je travail depuis quelques jours sur un site que j'ai fait à partir du tutoriel Réalisation d'un design complet (XHTML / CSS) en 5 étapes.

Ma page s'affiche bien lorsque j'utilise Firefox, par contre j'ai vérifié via Explorer, la page s'affiche bien aussi mais lorsque je bouge la souris, la page descend, j'ai essayé de trouver par moi même la solution mais je suis dans l'assez débutante au niveau du CSS alors je fait appel à vous si possible pour m'aider.

Voici le site en question

Merci d'avance à ceux qui prendront le temps de m'aider.
Modifié par Fibie (05 Mar 2008 - 13:49)
Smiley confused C'est pas que je voudrais insister mais est-ce qu'il y a quelque chose qui manque ou que je n'ai pas fait comme il faut pour que personne ne me réponde ? Smiley bawling

J'ai essayé de trouver ailleurs sur le forum mais sans succès et j'aimerais vraiment essayer de régler ce petit problème si possible.
Bonjour Fibie,

Il y a une raison particulière à ce padding-bottom de 1500px ?

div#contenu {
padding: 0 30px [#red][b]1500px[/b][/#] 100px ;
...
}

Cela crée également un espace disgracieux sous Firefox, Opera (sous ce bloc contenu ) et IE6 (qui étire le bloc contenu) seul IE7 a ce comportement (suivant les navigateurs testés chez moi)

Sans ce padding-bottom, on retrouve un comportement normal et une mise en page classique sous Firefox, Opéra, IE6 et IE7...
J'ai modifié les valeurs comme suit :
div#contenu {padding: 0 30px 15px 100px ;}


Pour info, seule la valeur nulle 0 (zéro) supporte l'absence d'unité :

ul#galerie_mini {
	margin: 10[#blue]px[/#] ; [#blue]Ou tout autre unité de mesure (em,etc..)[/#]
	padding: 0 ;
	list-style-type: none ;
}


En espérant que cela résoud ton soucis,
Cdt,
Sylvain
Je vais tester,
En fait je crois que j'avais mis ça parce que quand mon site était vide, on ne voyais pas le logo à gauche (si je ne me trompe pas..

Et merci pour la précision quant aux unités.

Je test et je reviens vous dire si ça fonctionne.
Merci encore d'avoir répondu

____________________________

Ahhhh Effectivement, ça règle le problème de descente du site sous IE! Merci infiniment!
Par contre, mon logo à gauche n'est pas complet si les images ne sont pas assez grande dans les albums ou sur la page d'arrivé
Modifié par Fibie (04 Mar 2008 - 21:46)
Fibie a écrit :

1 - Et merci pour la précision quant aux unités.
2 - Ahhhh Effectivement, ça règle le problème de descente du site sous IE! Merci infiniment!
3 - Par contre, mon logo à gauche n'est pas complet si les images ne sont pas assez grande dans les albums ou sur la page d'arrivé


1 - De rien Smiley cligne
2 - Cool, re-de rien Smiley smile
3 - Moui, forcément, ça ne pouvait pas durer tant d'éloges... Smiley bawling

Essaies avec ces propriétés :

div#contenu {
background:transparent url(couleur.gif) no-repeat -10px 55px;
height:850px;
min-height:850px;
padding:30px 30px 15px 100px;
}


J'ai bon ? Smiley lol

Sinon, pour ma culture, à quoi sert le commentaire conditionnel pour IE ?

Bonsoir Smiley cligne
Oh je t'aime toi!!

Merci!!!!!!! c'est génial

Alors si j'ai bien compris mon truc ici : padding: 0 30px 1500px 100px ; donnait en fait la marge pour le haut dans IE (par contre sous firefox ca me donnait ce que je voulais

alors qu'en le mettant dans le format que tu me dis ça bloque mon format à la bonne hauteur sans le déplacer sous les deux navigateur.. yaiy!

Et heu pour le commentaire Bien franchement j'ai rien capté au truc mais j,ai suivi le tutoriel et ils disaient ceci :
/* On doit donner une largeur au <pre> à cause d'Internet Explorer, 
on ne va donc l'appliquer qu'à Internet Explorer en utilisant le 
 commentaire conditionnel suivant, à placer dans la partie HTML, 
 et plus précisément dans l'élément <head> : */
<!--[if IE]>
 <style type="text/css">
 html pre
{
	width: 636px ;
}
</style>
<![endif]-->


Et comme j'écoute quand on me dit de faire un truc j'ai fait! (C'est peut-être inutile dans mon cas par contre ce commentaire j'en sais rien en fait Smiley sweatdrop )
a écrit :

Oh je t'aime toi!!
Merci!!!!!!! c'est génial

Arrêteeeuuuhhh Smiley confused Smiley lol
Dorien Smiley cligne

Ton padding-bottom provoquait un espace inférieur sous tous les navigateurs, Firefox compris, il y a certainement une bonne explication pour le saut qu'effectuait ta page sous IE7, mais la tout de suite, je ne vois pas très bien pourquoi ?!...

Pour la balise <pre>, elle affiche le texte tel qu'il est tapé , c'est à dire avec les retours à la ligne (pas besoin de rajouter des <br/>) les tabulations, entrée, etc...à toi de voir si tu en as besoin ou non dans ton cas, ceci dit a priori, ça ne semble pas faire de mal à IE...

Bonne continuation,
Cdt,
Sylvain
Bon ... j'ai droit encore de te dire merci ? Smiley confused

Merci pour les infos sur le pre j'avais pas trop compris

Ca fonctionne à merveille j'ai plus rien sur quoi râler Smiley confus

Ah j'vais faire un autre site tiens y'aura bien quelque chose!! Smiley rolleyes Smiley lol Smiley cligne
Fibie a écrit :

Bon ... j'ai droit encore de te dire merci ? Smiley confused
Merci pour les infos sur le pre j'avais pas trop compris
Ca fonctionne à merveille j'ai plus rien sur quoi râler Smiley confus
Ah j'vais faire un autre site tiens y'aura bien quelque chose!! Smiley rolleyes Smiley lol Smiley cligne

Hello,

Mais oui, ça fait toujours plaisir Smiley cligne
D'ordinaire, on fait dodo à 2.08 am... Smiley smile
Si tu considères ton sujet comme résolu, il faudrait l'indiquer dans le titre en éditant ton sujet initial (en rajoutant [résolu] )
Avant de commencer un nouveau site, tu pourras éventuellement passer tes pages au validateur ( http://validator.w3.org/ par exemple) et corriger les quelques erreurs de codage Smiley cligne

Bonne journée,
Sylvain