28221 sujets

CSS et mise en forme, CSS3

hello,

Je comprends pas ...
J'ai par exemple :


ul { 
margin : 0 ; 
padding : 0  ; }
li {float : left ;  margin : 2px ; }
et
<ul>
<li>bli</li>
<li>bli</li>
</ul>


et je voudrais aussi d'autres ul et d'autres li
Mais pas en float et avec d'autres parametres.
Seulement, je n'y arrive pas clairement ...

dois-je faire :


ul #machin2 {margin-top : 250px} 
li #truck2 {float : none}
puis
<ul id="machin2">
<li id="truck2">bla</li>
<li id="truck2">bla</li>
<li id="truck2"><bla/li
</ul>


merci pour votre aide.
Tu ne peux pas mettre plusieurs fois le même "id", il faut utiliser les "class", donc <li class="truck">...

Mais là ça n'a en fait aucun interet, tu as ton ul qui a un id et qui contient des <li> ayant la même class, donc les class sont en fait inutiles, tu peux donc faire comme ceci :

ul#machin2 {margin-top : 250px} 
ul#machin2 li {float : none}

puis

<ul id="machin2">
  <li>bla</li>
  <li>bla</li>
  <li><bla/li>
</ul>


Mais float: none... je vois pas trop l'interet non plus :s, par défaut les <li> ne flottent pas.
Oui.

En fait, je me sert des <ul> et <li> pour faire différents menus.
Celui du "haut" qui est horizontal et d'autres menus qui sont, eux, en liste.
D'ou m'on emploi du "float : none" pour annuler le "float : left" de la première
<li>

Non ?
Bah tu donnes un id à ton menu horizontal

<ul id="menu1">
  <li>...</li>
  <li>...</li>
  <li>...</li>
</ul>

Des class pour les autres menus s'ils ont le même style (des id sinon, un id par menu)

<ul class="menu_nav">
  <li>...</li>
  <li>...</li>
  <li>...</li>
</ul>

Et dans tes css

ul#menu1
{
  ppté: valeur ;
  ppté: valeur ;
  ppté: valeur ;
}

ul#menu1 li
{
  float: left ;
  ppté: valeur ;
  ppté: valeur ;
}

ul.menu_nav
{
  ppté: valeur ;
  ppté: valeur ;
  ppté: valeur ;
}

ul.menu_nav li
{
  ppté: valeur ;
  ppté: valeur ;
  ppté: valeur ;
}


Et c'est tout
ha ... ???

En fait je nomme aussi mes <li> ...
Je fais comme pour les <p>

Je fais dans ma css
p {margin : 0}
.top {margin-top : 10px

et ensuite
<p>bl bla bla</p>
<p class="top">bli bli bli</p>

Et il me semble (si j'ai bien compris), que d'après ton exemple la <li> prend
automatiquement la définition de la css ...
C'est à dire que je n'ai pas besoin de faire :
<ul class="machin>001</ul>
<li class="truck">aaa</li>
<li class="truck">aaa</li>
<li class="truck">aaa</li></ul>

mais seulement
<ul id="menu1">

  <li>...</li>

  <li>...</li>

  <li>...</li>

</ul>


Et que la <li> prend automatiquement "ses ordres" par la <ul> a cause du nom ...

Je m'excuse platement de ne pas être très clair, ce n'est pas de la mauvaise volonté.
merci.
si tu veux définir des propriétés css pour tes balises <li> tupeux aussi utiliser le sélecteur css #id_de_ton_ul li { prop1: opt1;...; } :)
@masterjmc> bis repetita c'est ce que j'expliquais plus haut... je dois utiliser des caractères invisible ???