1. Accueil
  2. Forum Codes-Sources
  3. Javascript / DHTML

Liste déroulante avec sous menu Firefox [Résolu]

Signaler
Messages postés
35
Date d'inscription
jeudi 30 juin 2005
Statut
Membre
Dernière intervention
13 avril 2007
 -
Messages postés
35
Date d'inscription
jeudi 30 juin 2005
Statut
Membre
Dernière intervention
13 avril 2007
 -
Bonjour,

si mon message n'est pas dans le bon thème, je m'en excuse, je n'en ai pas trouvé qui convienne bien :(

Voilà mon problème : j'ai une liste déroulante daans une page :

<select name="ideaAction" size="1" onchange="javascript:manageIdea();">
    <option value="">--- Actions ---</option>
    <option value="addobservation">Ajouter un commentaire</option>
    <option value="print">Imprimer les idées</option>
    <option value="printCompleteFile">Imprimer la fiche complète</option>
    <option value="closest">Lancer des recherches d'antériorité</option>
    <option value="moveIdea">Déplacer les idées</option>
    <optgroup label="Traitement">
        <option value="decideur">Modifier le porteur</option>
        <option value="askexpertise">Demander une tâche</option>
        <option value="nextPhaseWithTask">Lancer un projet d'innovation</option>
        <option value="modify">Modifier l'idée</option>
        <option value="challenge">Gérer les défis</option>
    </optgroup>
    <optgroup label="Classement">
        <option value="treatidea">Classer l'idée</option>
    </optgroup>
    <option value="delete">Supprimer l'idée</option>
    <option value="reboundIdea">Réutiliser l'idée</option>
</select>

Elle s'affiche très bien sous IE, mais sous firefox, les indentations pour les sous menu ne se font pas. D'où ma questions : conaissez vous un moyen d'afficher les sous menu avec indentation, et que cela fonctionne avec IE et FF.

Merci d'avance pour vos réponses
Afficher la suite

11 réponses

Réponse 1 / 11
Messages postés
732
Date d'inscription
jeudi 2 janvier 2003
Statut
Membre
Dernière intervention
29 octobre 2007
Bonjour




ben oui, c'est
optgroup option {blabla}

Cordialement
Roro webDev
Réponse 2 / 11
Messages postés
35
Date d'inscription
jeudi 30 juin 2005
Statut
Membre
Dernière intervention
13 avril 2007
oui, c'était bien un test, optgroup n'était pas modifié dans ma feuille de style, ni option, juste select.

du coup, j'ai trouvé la solution pour avoir la même version :

optgroup{
font-family: Arial, Verdana, Geneva, Helvetica, sans-serif;
font-size:1em;
}
optgroup option{
font-family: Arial, Verdana, Geneva, Helvetica, sans-serif;
font-size:1em;
font-weight:normal;
text-indent:20px ;
}

Tout ce qui est taille et indentation n'est pas pris en compte par IE, du coup, j'ai entré ce qui était déjà présent dans IE,n et FF et IE affiche donc la même chose !! :) vives les différents navigateurs ! Et merci beaucoup à vous deux !!
Réponse 3 / 11
Messages postés
13619
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
 32
Bonjour,
    ah... ?    je n'ai aucun souci ni avec Ie, ni avec FFk, ni K-meleon, ni Opera...
    l'affichage est "comparable".  avec Windows XP . parle-t-on de la même chose ?
<hr />


Cordialement                Bul    
Réponse 4 / 11
Messages postés
13619
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
 32
ou alors un ccs associé qui gène ?
<hr />


Cordialement            Bul    
Réponse 5 / 11
Messages postés
35
Date d'inscription
jeudi 30 juin 2005
Statut
Membre
Dernière intervention
13 avril 2007
en fait, l'affichage se fait quand même, mais sans les indentations. Sous IE, l'affichage se fait avec la police définie pour les niveaux 1 et 3, et en gras pour le niveau 2, avec une indention à chaque niveau.
Sous FF, l'affichage se fait avec la police définie pour le niveau 1, gras pour le niveau 2, italique pour le niveau 3, et sans indentions, et c ce qui me manque

j'espère que je suis claire ?!
Réponse 6 / 11
Messages postés
13619
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
 32
la seule différence que je vois c'est la "qualité de la police" des lignes affichées.
gras,italique,indentation... me semblent pareil. ( j'ai mise size=50 pour tout voir et
pouvoir comparer ).  désolé.
<hr />


Cordialement                Bul    
Réponse 7 / 11
Messages postés
35
Date d'inscription
jeudi 30 juin 2005
Statut
Membre
Dernière intervention
13 avril 2007
ça, c bizarre, vu que j'ai la version 6.0, je me suis dit que c'était un problème avec la nouvelle version de IE, mais même sur la nouvelle, les identations sont visibles. Le mieux est peut être de te montrer la différence que j'ai, afin aussi de savoir quelle version tu vois toi !

sous IE :

sous FF :
Réponse 8 / 11
Messages postés
732
Date d'inscription
jeudi 2 janvier 2003
Statut
Membre
Dernière intervention
29 octobre 2007
Bonjour




faudrait voir ta feuille de style

Cordialement
Roro webDev
Réponse 9 / 11
Messages postés
35
Date d'inscription
jeudi 30 juin 2005
Statut
Membre
Dernière intervention
13 avril 2007
feuille de style faisant 1777 lignes, je te passe juste ce qui nous concerne :

input, textarea, select{
font-family: Arial, Verdana, Geneva, Helvetica, sans-serif;
font-size:1em;
font-weight:normal;
}

en faisant des recherches, j'ai vu que, en effet, les sous groupes dans une liste déroulante dépendent bien du navigateur :(

Du coup, je pensais faire une spécificité dans la css. Le souci, c que si je fais :
optgroup{
text-indent:40px ;
}
ça n'indente que le titre de l'optgroup
et forcément, si je fais
option{
text-indent:40px ;

}
Ca indente toutes les options. Donc est-ce possible de choisir de n'indenter que option dans optgroup, avec quelque chose du style optgroup.option (dslée si je raconte n'importe quoi) ?
Réponse 10 / 11
Messages postés
13619
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
 32
il doit y avoir autre chose...

<style type="text/css">
input, textarea, select{
font-family: Arial, Verdana, Geneva, Helvetica, sans-serif;
font-size:1em;
font-weight:normal;
}
</style>
<select name="ideaAction" size="50">
    <option value="">--- Actions ---</option>
    <option value="addobservation">Ajouter un commentaire</option>
    <option value="print">Imprimer les idées</option>
    <option value="printCompleteFile">Imprimer la fiche complète</option>
    <option value="closest">Lancer des recherches d'antériorité</option>
    <option value="moveIdea">Déplacer les idées</option>
    <optgroup label="Traitement">
        <option value="decideur">Modifier le porteur</option>
        <option value="askexpertise">Demander une tâche</option>
        <option value="nextPhaseWithTask">Lancer un projet d'innovation</option>
        <option value="modify">Modifier l'idée</option>
        <option value="challenge">Gérer les défis</option>
    </optgroup>
    <optgroup label="Classement">
        <option value="treatidea">Classer l'idée</option>
    </optgroup>
    <option value="delete">Supprimer l'idée</option>
    <option value="reboundIdea">Réutiliser l'idée</option>
</select>

                ====> "pareil" avec FF,IE....

<hr />


Cordialement            Bul    
Réponse 11 / 11
Messages postés
13619
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
 32
ah... j'ai cru comprendre que c'était un test fait
            uniquement  à cause du défaut d'affichage...
alors, bien entendu, ce css sur optgroup fausse tout.
<hr />


Cordialement            Bul    
Répondre Posez votre question