[résolu] Image Background sous ie et firefox

Re...

J'ai une image en background dans ma frame, sur la gauche pour faire des bords arrondis...sous firefox nikel , sous ie ya rien ! c'est la première fois que je vois ça !

http://bhsoh.free.fr/


Merci
Modifié par yank (02 Jun 2006 - 18:57)

vraiment personne ?

en fait ton image s'affiche bien, mais ton menu de gauche chevauche le contenu de droite, et donc le rose clair se pose "sur" l'image...
il faudrait voir au niveau de la largeur et de la couleur de fond de .menu et .menugauche

Je cherche...

.menu {
	left: 0px;
	width: 200px;
	position: absolute;
	height: 430px;
	background-color: #CC0033;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #ffffff;
	color: #ffffff;
	background-image: url(visuels/menu1.gif);
}
.frame {
	margin-left: 200px;
	margin-right: 20px;
	overflow: auto;
	width: 530px;
	height: 430px;
	background-color: #330000;
	color: #FFFFFF;
	background-image: url(visuels/frame1.gif);
	background-repeat: no-repeat;
	background-position: left;
}
.menugauche {
	margin: 20px 0px 0px 20px;
	list-style-type: none;
	text-align: left;
	padding: 0px;
	background-color: #CC0033;
	color: #ffffff;
}

Ce que je ne comprends pas c'est que firefox, c'est nikel mais pas sous ie... c'est galère serieux ie
Modifié par yank (01 Jun 2006 - 20:33)

Sérieux, je ne trouve pas...

J'ai testé plein de choses mais il n'y pas moyen...en effet, c'est du "entre autres" a la couleur de fond des menu, menu gauche...etc, (et quand on ne met pas de couleurs de fond on a un avertissement à la validation... )donc pour faire le même effet j'ai simplement fait l'arrondi en image background dans le menu, ce qui donne l'impression du même effet sous ie et firefox mais du coup l'eccart est trop important..enfn bref c'est pas terrible et ie c'est de la merde...bref

Je laisse comme ça, l'important c'est que ça soit accessible et voila jverrai apres pour le design quand ie n'existera plus...

Merçi quand même...

J'attends demain pour mettre un "résolué au cas ou quelqu'un trouve une solution miracleu

Salut,

Personnellement je vois exactement la même chose entre firefox 1.5 et internet explorer 6.0...

Mikachu a écrit :
Salut,

Personnellement je vois exactement la même chose entre firefox 1.5 et internet explorer 6.0...

Idem

Vous voyez la même chose !?

Je parle de "l'arrondi" de ma frame sur le bord gauche...

Car le div global en effet est arrondi sur les 2, mais au centre, ma frame ne s'affiche pas en arrondi sur ie pourtant j'ai la version 6 il me semble...

Alors la je comprends pas

Je vous met des captures d'ecran






Voila ce que je vois la ou il y a la souris

Aaaaaah le cadre marron !
Comme tu disais le bord gauche j'ai fait attention au bord gauche du site... Comme quoi quand on s'exprime pas bien, on focalise l'interlocuteur sur autre chose. Résultat, avec firefox sur un écran et IE sur l'autre, j'ai même pas vu la différence entre les deux malgré tout, c'te honte !

Mikachu a écrit :
Aaaaaah le cadre marron !
Comme tu disais le bord gauche j'ai fait attention au bord gauche du site... Comme quoi quand on s'exprime pas bien, on focalise l'interlocuteur sur autre chose. Résultat, avec firefox sur un écran et IE sur l'autre, j'ai même pas vu la différence entre les deux malgré tout, c'te honte !

Re-idem

Mikachu a écrit :
Aaaaaah le cadre marron !
Comme tu disais le bord gauche j'ai fait attention au bord gauche du site... Comme quoi quand on s'exprime pas bien, on focalise l'interlocuteur sur autre chose. Résultat, avec firefox sur un écran et IE sur l'autre, j'ai même pas vu la différence entre les deux malgré tout, c'te honte !

oui c'est moi aussi qui me suis mal exprimé..

Avec une image au moins c'est clair une solution ?

Oui oui les images ont aidé à comprendre que tu parlais pas de ca.

Je suis en train d'essayer de trouver une solution.

Merçi de m'aider

J'ai egalement .menugauche li et d'autres class avec une couleur de fond rouge (rose) qui se trouvent dans ce menu justement mais je ne pense pas que ça soit le probleme...

Vous voulez plus de mon code css?

***** pas evident à comprendre ces navigateurs

J'ai tout pris en local et j'essaye de comprendre...

Bon, en virant la couleur de fond de .menugauche et .menu et en positionnant le fond dans #iframe à 0 0 comme ci dessous,

background-position: 0 0;

déja il apparait !
Sauf qu'il défile avec le scrolling, ce qui pose problème.
Je pense que pour corriger le scrolling, si tu met le contenu dans un autre conteneur que #frame, situé dans ce dernier, l'image ne devrait pas bouger car le div ne sera pas scrollable, en revanche le nouveau conteneur défilerait par dessus avec l'overflow auto.

De plus, un carré rouge semble dépasser de la zone du switch. Ca je sais pas comment le corriger. (peut être en faisant passer le bouton changer en dessous de la liste déroulante (?))
Modifié par Mikachu (02 Jun 2006 - 11:21)

Ok, merçi pour ton aide

Je vais réflechir à une solution...et au pire et bien tant pis pour tous ceux qui seront sur ie... c'est juste que je trouvais ça plus sympa la forme arrondi que droit comme dans ie...

Merçi !

ok merçi j'vais tester
Modifié par yank (02 Jun 2006 - 11:23)

Je viens d'éditer mon message ci dessus, j'avais fait une erreur

le problème c'est que du coup, sans la zone arrondie, ton texte à une marge gauchetrès faible par rapport à la gauche de son conteneur, alors que celle de droite est bien plus grande !
Modifié par Mikachu (02 Jun 2006 - 11:25)

Mikachu a écrit :
Je viens d'éditer mon message ci dessus, j'avais fait une erreur

le problème c'est que du coup, sans la zone arrondie, ton texte à une marge gauchetrès faible par rapport à la gauche de son conteneur, alors que celle de droite est bien plus grande !

en effet raaa pas evident

Alors la c'est la meilleur jai reussi à le faire sous ie mais ca ne fonctionne plus sous firefox

j'ai mis ça :

.frame {
	margin-left: 200px;
	margin-right: 20px;
	overflow: auto;
	width: 530px;
	height: 430px;
	background-color: #330000;
	color: #FFFFFF;
	background-image: url(visuels/frame1.gif);
	background-repeat: no-repeat;
	background-attachment: fixed;
}

fixed fonctionne nikel sous ie du coup et larrondi dans la frame reste en place avec no repeat...

.form {
	border: none;
	padding: 0px;
	width: 180px;
	margin-bottom: 20px;
	margin-top: 10px;
}

Et la j'ai mis 180px au lieu de 200, c'est ce qui faisait que l'on ne voyait pas limage sous ie car caché par le bloc du bouton apparement...

Mais maintenant c'est firefox qui me pose probleme...

Vais je m'en sortir je vais devenir taré

voila en fait, quand je mets "fixed" ca fonctionne sur ie mais firefox place limage dans le flux tout a gauche de la page en haut...dans le body en fait...

J'ai reussi à le voir car j'ai remplacé mes 2 bords par une image entiere qui fait la taille de la frame...