Aide sur mon CSS SVP...

[Marie-Aude]

Bon j'ai essayé de faire un CSS correct, et j'ai un problème que je n'arrive pas à résoudre avec les menus horizontaux.

J'ai un div MenuSub qui contient les menus, et sous lequel vient se placer un deuxième div, contenant le texte de ma page, et ayant en background une petite image qui doit être collée sous la zone de menu, div où je mets simplement une classe pour l'affichage de l'image.

Bon sous Firefox, le div qui devrait être sous le menu démarre au même endroit que le menu (mais les textes apparaissent en dessous du menu), donc l'image est tronquée (on ne voit que le bas qui dépasse en dessous des menus)

Sous IE7 l'image commence bien sous le menu, mais en revanche j'ai un problème avec le menu que je n'ai pas sous Firefox : quand on redimensionne l'écran, le dernier élément de menu sous la droite peut éventuellement se mettre sur deux lignes, ce qui fait affreux !

Sous IE6 c'est pareil, et en plus je viens de m'apercevoir que le correctif que j'utilise pour l'affichage des PNG ne fonctionne pas pour les PNG en background ou en élément de liste....

Au secours !

la page : -http://www.oasisdemezgarne.com/test2.htm
la feuille de style : -http://www.oasisdemezgarne.com/style2.css

[dadboss]

C'est un peu hs mais c'est normal qu'il y ait(si j'ai bien compté neuf fois compté)Accueil
contact reservations ?!!

[Marie-Aude]

Oui c'est normal parce que pour l'instant je remplis sans trop me casser la tête, je fais le template de la page, et après je mettrai le bon menu

Et en plus si je ne trouve pas la solution à mon problème de PNG en background, je vais être obligé de changer le menu... donc contente de pas m'être fadé toutes les images

D'ailleurs c'est pour ça que ça s'appelle test

[maniT4c]

en ce qui concerne le redimensionnement c'est un problème de IE avec les LI.
De tête je crois qu'il faut que tu fixe la hauteur de tes menu pour obliger ie à passer correctemnet à la ligne...

Pour les png en background va voir c'edt deux pages:

http://www.wikistuce.info/doku.php/css/ ... ackgrounds

http://www.wikistuce.info/doku.php/java ... ransparent

[Marie-Aude]

ça marche pas ça me fait disparaitre mon background sur IE6

Sinon pour la hauteur de ligne ça marche.... reste à bien disposer ce background en coin ...

[MarvinLeRouge]

Salut,

Si tu veux que Ton texte ne passe pas à la ligne, ça se fait avec la propriété white-space.
Si tu as des problèmes avec tes li sous IE, il faut généralement coller tous les tags fermants, etle tag li ouvrant souvant, comme ça

Code: Tout sélectionner

</a></p></li><li>

NB : C'est un exemple
Et pour les png, cherche un script qui s'appelle iepngfix.htc. Sinon, il y a une autre solution avec une feuille de style spécifique IE, mais ça interdit les background en motif (alors des fois, on truande en mettant une seule image, très grande). Si le script ne marche pas, dis le, je te retrouverai l'autre méthode.

[Marie-Aude]

Non mon problème n'est pas sur le png, ça c'est réglé, il est sur les png utilisés en images de fond. Je n'arrive pas à faire fonctionner iepngfix sur mes backgrounds.

Et en plus il a un effet flicker pas très beau par rapport à la solution que j'utilisais avant

[Marie-Aude]

Bon en désespoir de cause, j'ai appliqué la méthode des commentaires conditionnels... et ça marche

Maintenant il me reste UN seul problème : le petit coin jaune qui est placé correctement dans IE et pas dans Firefox... j'en conclus donc à une erreur de code mais je ne sais pas si elle est dans le CSS ou dans l'imbrication de mes zones dans la page ...

[Leonick]

et en corrigeant les erreurs html ? http://validator.w3.org/check?verbose=1 ... Ftest2.htm

[Marie-Aude]

C'est jamais inutile de corriger, mais ma page maintenant valide W3C a toujours le même problème.... tu es sous FF ou sous IE ?

Je pense que le problème est réellement dans le CSS, dans un contexte de positionnement qui ne va pas, mais je n'arrive pas à voir où.