Aide sur mon CSS SVP...

WRInaute accro
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
 
WRInaute discret
C'est un peu hs mais c'est normal qu'il y ait(si j'ai bien compté neuf fois compté)Accueil
contact reservations ?!!
 
WRInaute accro
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
 
WRInaute accro
ç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 ...
 
WRInaute impliqué
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:
</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.
 
WRInaute accro
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 :(
 
WRInaute accro
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 ...
 
WRInaute accro
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ù.
 

➡️ Offre MyRankingMetrics ⬅️

pré-audit SEO gratuit avec RM Tech (+ avis d'expert)
coaching offert aux clients (avec Olivier Duffez ou Fabien Faceries)

Voir les détails ici

coaching SEO
Discussions similaires
Haut