28173 sujets

CSS et mise en forme, CSS3

Bonjour,
j'ai une boite .sommaire qui contient deux colonnes .colonne1 et .colonne2 et je voudrais modifier les styles de liste seulement dans cette boite sommaire.
.sommaire ul { ou div.sommaire ul {
.colonne1 ul{
ne me donnent rien. Où est mon erreur ?
merci
faudrait voir les proprietes que tu modifies pour te donner un avis .
Sinon .sommaire ul et .colonne1 ul devraient fonctionner la syntaxe est bonne
Merci de ta réponse rapide. Ca m'agace ce truc
voici les css de base
ul {list-style-image: url('../images/boutons/puce1.gif'); text-align: justify; margin-right: 30px; margin-left: 30px}

ul ul {list-style-image: url('../images/boutons/puce2.gif'); text-align: justify; margin-right:30px; margin-left: 30px}

et voici celles pour la boite sommaire
.sommaire {width: 90%; margin-left: 50px;}

.sommaire ul {color: #cc6600; font-weight: bold; list-style-image: url(../images/boutons/puce1.gif); margin-left: 30px; padding-top: 3px; text-align: left}
.sommaire ul ul {list-style-image: url(../images/boutons/puce4.gif); text-align: left; Font-weight:normal; margin-left:10px;}
c'est normal ,
elles heritent des premieres regles regle ul et ul ul.
faudrait que tu mettes un selecteur avant les 1ere regles
Aie là je comprends plus !
pourquoi ça
.page_haut {background: #DADADA; height:90px; color:000033; font-size: 0.8 em; }
div.page_haut a:link {text-decoration: none; color:#CD007D;}
div.page_haut a:visited{text-decoration: none; color:#CD007D;}
div.page_haut a:hover {text-decoration:underline; color: #FFF;}
ca marche ? Autrement dit pourquoi dans ce cas je peux modifier les balises de base des liens et je ne pourrai pas modifier les balises de liste ?
Salut petit topo

Les styles de ul deviennent les styles par défaut de toutes les listes

Dans .sommaire ul tu rajoute (ou modifie) les styles de la lliste contenu par sommaire

Donc si tu fais un CSS comme ceci

ul {
list-style-image: url('../images/boutons/puce1.gif');
text-align: justify;
margin-right: 30px;
margin-left: 30px
} 
.sommaire ul {
list-style-image: url(../images/boutons/puce1.gif);
color: #cc6600;
font-weight: bold;
margin-left: 50px;
padding-top: 3px;
text-align: left
}

Les styles de la liste dans sommaire deviennent

list-style-image: url(../images/boutons/puce1.gif);
color: #cc6600;
font-weight: bold;
margin-left: 30px;   /* Style par défaut origine ul  Cela s’appelle l’héritage */
margin-right: 50px; /* Style forcé  opposé a ul */
padding-top: 3px;
text-align: left;      /* Style forcé  opposé a ul */

Pour annuler les styles par défaut il faut les redéfinir en
ajoutant dans ce cas au style .sommaire ul

margin-left: 0px;                                                    

Donc il ne faut pas définir de style par défaut sauf dans les cas ou tu en auras besoin partout ( par exemple la couleur d’une police ! …)
Dans le cas des listes il suffit de leur donner un ID ou Class ou de toujour mettre l’ID ou Class du conteneur dans le style

Fin du topo


A+