28221 sujets

CSS et mise en forme, CSS3

Affichage IE ok Firefox pas ok

Bonjour tout le monde

j'ai un petit problème d'affichage avec une image dégradé
voici un lien avec la page test

sous IE l'affcihe s'affiche très bien mais sous firefox l'image ne s'affiche pas (je vous laisse comparer).
le code de la page est très simple et pour la feuille de style il faut regarder le code à partir de cette ligne /* DISPOSITION DES BLOCS */

j'ai essayé pas mal de truc (mettre l'image à répéter dans un autre div, de controler les padding et les margin, ...)

merci d'avance
Le problème viendrait du background-attachment: fixed; qui se trouve dans ton #conteneur.

[EDIT]
Grillé ^^
Modifié le 04 Jan 2005 - 10:50
Nyro Xeo a écrit :
Le problème viendrait du background-attachment: fixed; qui se trouve dans ton #conteneur.

grillé Smiley langue
ah super merci Poire Smiley smile

sinon je vien de m'appercevoir d'un autre bug avec l'affichage en 100% en hauteur (voir la page test)
le fond blanc ne vas jusqu'au bout de la page (toujour sour firefox)
je n'ai pas compris ce que tu veux dire
mon #deconex (ce bolque n'est pas présent dans cette page test) est
height: 17px;
width: 275px;

et non
height: 275px;


pourquoi veux-tu que je met 
height:275;
à #conteneur ?
Bizarre, j'ai cru voir un height:275; (de plus que je l'ai copié pour le coller ici, soit j'ai rêvé et je l'ai pas copié et il n'y a jamais eu de height:275 (solution plus probable), soit j'ai rêvé tout court).

Bon ton bloc est en position:absolute, donc si tu lui mets un height:100%, il fera 100% de la page. Donc enlève lui le height:100%.
en mettant #conteneur height à 100% sur IE l'affichage était bon mais sous firefox la zone de fond de mon conteneur rester bloké a 100% de la fenetre (pas de la page) donc si je descendait je n'avais plus de fond

maintenant j'ai enlevé height: 100% et avec là le fond de mon conteneur ne va plus jusqu'en bas de la page mais reste collé a la derniere ligne de texte :s (sur IE et sur Firefox).
Sur le billet du blog auquel fait référence Raphaël tu as la solution pour obtenir le résultat, et sous IE et sous firefox. Dans les commentaires au moins
euh je n'ai pas vraiment compris ce que je devais mettre.

j'ai rajouté html{ height:100%;} vu sur le tuto

ya du mieu mais c pas encore ca sous firefox et sur MAC je pense ...
Administrateur
Sebou San a écrit :
euh je n'ai pas vraiment compris ce que je devais mettre.

j'ai rajouté html{ height:100%;} vu sur le tuto

ya du mieu mais c pas encore ca sous firefox et sur MAC je pense ...

Tu n'as pas utilisé la propriété min-height Smiley ohwell
ok sur PC (IE et Firefox) ca marche très bien Smiley smile

sur MAC (firefox) nikel aussi

par contre ca bug sur MAC (IE et Safari) [voir l'exemple]

html, body {
	width: 100%;
	height: 100%;
}
#conteneur {
	position: absolute;
	left: 50%;
	padding: 0px;
	margin-left: -375px;
	width: 760px;
	background-color:#FFFFFF;
	background-image: url(img/main-degrade.gif);
	background-repeat: repeat-y;
	background-position: right;
	height: 100%;
}
html>body #conteneur {
	height: auto;
	min-height: 100%;
}
Sujet clos
Aller à