28172 sujets

CSS et mise en forme, CSS3

Salut à tous,

Bon alors que des membres du forum m'ont donné un sérieux coup de pouce sur le positionnement de mes footers sous IE7/FF2/FF3 (cf. ce post), je viens de rencontrer un nouveau problème de positionnement de footer, mais cette fois... sur IE6 !

En réalité, le problème n'en est un qu'à moitié : il subsiste une marge sous mon footer, qui ne veut pas se coller tout en bas. Mais si on redimensionne la page, le footer finit par se caler là où il faut ! Et même si on repasse en pleine page ensuite, le footer reste à sa place, tout en bas !

Soucieux de ne pas afficher un message d'alerte au chargement du site, du genre : "veuillez rétrécir puis réagrandir votre page de navigateur" Smiley biggrin , j'aimerais avoir votre avis pour remédier à ce problème.

La page en question (sous IE6 uniquement, enfin... je crois !)

Peut-être que ça peut aider, j'ai mis dans la page le code suivant :
	<!--[if lte IE 6]>
	<style type="text/css" media="screen">
	div#page {
		height: 100%;
	}
	</style>
	<![endif]-->


A bientôt (SVP ! ) Smiley smile
Bonjour,

C'est un problème que l'on observe régulièrement avec divers navigateurs sur ce type de mise en page: le calcul de la hauteur exacte du conteneur positionné en relatif (servant de référent pour le positionnement absolu du pied de page) n'est pas toujours exact. Cela peut venir du contenu dont les dimensions ne sont pas connues lors du dessin de la page par le navigateur (par exemple s'il y a des images sans attributs height et width renseignés dans le code HTML), ou d'autres subtilités. Recharger la page règle généralement le problème.

Ça arrive plus souvent avec certains navigateurs, mais je ne saurais pas dire exactement lesquels. Je ne suis pas sûr qu'on puisse «corriger» ce problème, qui serait plutôt lié aux performances des navigateurs. Solution éventuelle: ne pas utiliser de pied de page positionné en absolu. Smiley cligne
Merci pour ta réponse ! Donc en gros on doit subir la fatalité de l'incompatibilité des explorateurs... Triste conclusion ! Smiley decu
gekk0 a écrit :
Donc en gros on doit subir la fatalité de l'incompatibilité des explorateurs...

Disons que l'on peut sans doute trouver des parades, mais qu'elles ne sont pas évidentes car il faudrait avoir une bonne connaissance du fonctionnement interne du moteur de rendu de chaque navigateur pour savoir ce qui peut poser problème exactement, et corriger ou contourner le problème.

Et il ne s'agit pas ici d'une incompatibilité des navigateurs à proprement parler. Ce type de positionnement pose un défi technique aux navigateurs: il faut placer l'élément positionné en absolu à un endroit précis, mais cet endroit exact dépend de l'affichage d'un contenu qui n'est pas forcément chargé lorsque le navigateur veut «dessiner» la page. Les navigateurs font sans doute des micro-réajustements de l'affichage de la page au fur et à mesure du chargement du contenu, mais ça reste difficile à négocier.

Pour information, la dernière fois que j'ai eu ce genre de problème (sans trouver de solution...), c'était avec... Safari 3.1.

gekk0 a écrit :
Triste conclusion ! Smiley decu

Je ne vois pas ce qu'il y a de triste à constater que cette technique a une marge d'erreur. C'est plutôt une information utile, au contraire.


Et pour ta page elle-même:
1. Tu peux placer l'image de décoration du pied de page en fond de l'élément div#page. Déjà, c'est plus logique de le placer comme image de fond d'un conteneur (même si ici on aurait pu vouloir utiliser le pied de page) plutôt qu'en fond d'un bloc flottant vide. Ensuite, ça t'assure d'avoir cette image de fond toujours bien placée.
2. Pour le texte du pied de page, le placer en flux (pas positionné en absolu, donc) à la fin de div#page suffira largement. À moins que tu n'aies de pages très courte, tu devrais pouvoir obtenir un rendu satisfaisant.
Bon ok je vais essayer cette technique (même si en effet, la structure des pages ne sera pas homogène puisque les pages 'longues' seront différentes des pages 'courtes').

Merci en tout cas pour le support !

Je reviens dès que j'ai fait les tests.