28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J’ai intégré le menu déroulant jQuery sur ma page html et je n’arrive pas à résoudre
les différents problèmes de la page.

1) sur la page elle-même :
- sous IE la photo en arc-en-ciel apparaît à droite de la page alors qu'elle doit être gauche.
- Il ne doit pas y avoir ce trait vertical gris sur la gauche de l’écran.

2) Sur le menu déroulant :
- Sous IE aucune puce de visible
- Sous Firefox les puces des sous-menus n’apparaissent pas à côté du titre.
- Je voudrais avoir une couleur différente pour les titres des sous-menus.

Ci-joint le lien de ma page :

http://arsf.free.fr/Informations/Sommaire-Informations-test.html

Merci pour votre aide.

Salutations
Bonjour,

jmde1 a écrit :
- sous IE la photo en arc-en-ciel apparaît à droite de la page alors qu'elle doit être gauche.

Quelle(s) version(s) d'IE? 6, 7, 8?

jmde1 a écrit :
- Il ne doit pas y avoir ce trait vertical gris sur la gauche de l’écran.

Si mes yeux ne me trompent pas, la bordure en question fait partie de l'image suivante:
http://arsf.free.fr/Outils/Arriere-plan/Multicolore-1.png
Il faut donc modifier l'image.

jmde1 a écrit :
- Sous IE aucune puce de visible

Même chose, quelle(s) version(s)?

jmde1 a écrit :
- Sous Firefox les puces des sous-menus n’apparaissent pas à côté du titre.

Les puces s'affichent bien pour moi.

jmde1 a écrit :
- Je voudrais avoir une couleur différente pour les titres des sous-menus.

Ça tombe bien, tu as déjà un sélecteur CSS qui vise les liens dans les sous-menus, il suffit d'ajouter aux déclarations CSS (couples propriété-valeur) une déclaration avec la propriété color et la couleur de ton choix.
Modifié par Florent V. (23 May 2009 - 17:50)
Bonjour Florent V,

Merci pour ta réponse, ma version IE= 8 et Firefox=3.010

Ci-joint Image menu en local:
upload/15219-Menu-1.GIF

Ci-joint Image menu sur le site:
upload/15219-Menu.GIF

A+

Salutations
Pour les différences avec les puces, je ne me les explique pas vraiment. C'est peut-être lié à l'utilisation d'un padding-left sur les liens? Firefox placerait les puces à une certaine distance à gauche du LI, tandis qu'IE placerait les puces à une certaine distance à gauche du premier texte dans le LI (ce qui à certains égards est plus logique... d'ailleurs Firefox adopte un comportement similaire dans certains cas bien précis).

Solutions possibles:
- enlever les puces automatiques, et recréer un visuel de puces avec des images de fond (laisse plus de liberté de mise en forme);
- passer les puces en list-style-position: inside (si c'est le comportement d'IE8 qui est recherché).

Quant à l'arc-en-ciel, c'est le positionnement fixe qui est utilisé (plutôt qu'une image de fond en background-attachment:fixed?... pas sûr que ça soit pertinent), donc il serait bon d'utiliser les propriétés top et left pour placer cette image à l'emplacement voulu.
Et si je puis me permettre: utiliser un service qui permet de créer un site sympa pour cette association, ce serait peut-être s'épargner certains efforts inutiles pour obtenir au final un meilleur résultat? Je pense notamment à http://monassoc.com/

(Disclaimer: site conçu par des amis et des collaborateurs. Smiley cligne )
Bonsoir,

Je reprends mon post sur le menu déroulant car j’ai quelques problèmes.

http://arsf.free.fr/Informations/Sommaire-Informations.php

1) Je n’arrive pas, sur les titres du menu, à afficher l’image de fond « menu-200x25.png » (En interne l’image apparaît)

2) Le titre Groupe de Réflexion comprend trois sous-menus. Lorsque je clique sur le 1er sous-menu la page s’ouvre correctement, si je clique sur le deuxième sous-menu j’ai une erreur.

3) Je voudrais fixer le titre H1 pour que la page principale passe en dessous.

4) Voici ce que j’obtiens :

http://arsf.free.fr/Informations/Menu-deroulant/Page-menu-deroulant-test.html

Merci pour votre aide.

Salutations