Liste CSS en ligne

Résolu/Fermé

zvib Messages postés 62 Date d'inscription vendredi 7 mars 2008 Statut Membre Dernière intervention 27 octobre 2009 - 7 mars 2008 à 01:16
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 - 16 mars 2008 à 01:47

Bonjour,
j'ai une liste de la forme:

<ul id="mainlevel_menulex"><li>
<a href="/a/" class="mainlevel_menulex">A</a></li>
<li><a href="/b/" class="mainlevel_menulex">B</a></li>
...
</ul>

je souhaiterais l'afficher en ligne:
A B ...

j'ai essayé de definir:
a.mainlevel_menulex{
display:block;
}

ul.mainlevel_menulex {
display:inline;
}
mais ca ne marche pas.

Je sais c'est un peu sale de prendre une liste pour faire un menu en ligne mais je n'ai pas vraiment le choix.

Merci d'avance

A voir également:

4 réponses

Réponse 1 / 4

Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920
7 mars 2008 à 01:44

salut,

essaie :

ul.mainlevel_menulex li 
{
display:inline;
}

c'est un peu sale de prendre une liste pour faire un menu en ligne
pas du tout, c'est très bien.

zvib Messages postés 62 Date d'inscription vendredi 7 mars 2008 Statut Membre Dernière intervention 27 octobre 2009 21
7 mars 2008 à 18:07

Salut, j'ai essayé ce que tu m'as dit mais ça ne marche pas non plus.

<div class="moduletable_menulex">
<ul id="mainlevel_menulex">
<li><a href="/a/" class="mainlevel_menulex" >A</a></li>
<li><a href="/b/" class="mainlevel_menulex" >B</a></li>
...
</ul>
</div>

et le css:

a.mainlevel_menulex{
	display:block;
}

ul.mainlevel_menulex li{
	display:inline;
} 

div.moduletable_menulex{
	padding: 0px 6px 4px 6px;
	border-bottom: 2px solid #DFDFDA;
}

ce que j'ai du mal à comprendre c'est le rôle du <ul id="mainlevel_menulex"> pourquoi id et pas class? quelle est la différence?

Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920 > zvib Messages postés 62 Date d'inscription vendredi 7 mars 2008 Statut Membre Dernière intervention 27 octobre 2009
7 mars 2008 à 18:17

rolala que chui nul !

pardon j'ai pas vu que tu as utilisé un point pour l'identifiant et je n'ai pas vérifié…
les autres classes ou identifiants doivent être inutiles, tu vas pouvoir sélectionner depuis le <div>.

HTML

<div id="moduletable_menulex">
     <ul>
          <li><a href="a">A</a></li>
          <li><a href="b">B</a></li>
          ...
     </ul>
</div>

CSS

div#moduletable_menulex
{
	padding: 0px 6px 4px 6px;
	border-bottom: 2px solid #DFDFDA;
}
div#moduletable_menulex ul li
{
	display:inline; /* si tu veux avoir les liens en {display:block;}, remplace le par {float:left;} */
} 
div#moduletable_menulex ul li a
{
	display:block; /* c'est contradictoire avec le {display:inline;} du conteneur (<li>) */
}

pour aller plus loin :

• {http://css.alsacreations.com/Bases-et-indispensables/Quelle-est-la-difference-entre-une-classe-et-un-id différence entre classes et identifiants] (tu peux parcourir tous les tutos, c'est de l'or en barre !)

• CSS Débutants

• une introduction à CSS

zvib Messages postés 62 Date d'inscription vendredi 7 mars 2008 Statut Membre Dernière intervention 27 octobre 2009 21 > Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016
7 mars 2008 à 18:55

bon ça marche tjrs pas. Le code est genere par un cms (joomla) donc en fait y'a plein de div au-dessus:

<div id="ja-containerwrap2">
<div id="ja-container">
<div id="ja-container2" class="clearfix">
<div id="ja-mainbody-fr">
<div id="ja-contentwrap">
<div id="ja-content">
<div class="ja-box" style="width: ;">

Je suppose qu'il ya qqch qui bloque parmi tous ces styles, non? je vais regarder ça, merci en tout cas.

essaie en mettant {float:left;} au <li> et sans mettre {display:block;} au <a>.

non plus...

Réponse 2 / 4

prokhalid Messages postés 1 Date d'inscription vendredi 7 mars 2008 Statut Membre Dernière intervention 7 mars 2008
7 mars 2008 à 14:22

bonjour tout le monde,
je suis débutant en html et je viens d'attaquer la partie css!! mais j'arrive pas à bien comprendre cette partie
sur le net je trouve pas quelque chose de claire et simple!!
svp s'il y a quelqu'un qui pourra m'aider avec des exemples simples j'en serai remerciant!!
en attendant je vou ssouhaite bonne journée

Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920
7 mars 2008 à 15:10

salut,

tu aurais dû ouvrir ton propre fil de discussion.

pour ta question, je n'ai pas le temps de C/C tous les liens, je te renvoie donc vers cette page qui contient quelques liens intéressants.

Réponse 3 / 4

jérémy1664 Messages postés 165 Date d'inscription lundi 4 juin 2007 Statut Membre Dernière intervention 3 juillet 2008 4
7 mars 2008 à 15:56

Je te conseil https://openclassrooms.com/fr/courses pour apprendre le css tu verra c'est un langage très facile à comprendre

Réponse 4 / 4

Fredou-x3
15 mars 2008 à 20:29

J'ai un probleme avec ma liste. Voici les codes :

<BODY>

<CENTER><FORM>
<SELECT NAME="ListeUrl" SIZE=1 onChange="ChangeUrl(this.form)">
<OPTION SELECTED VALUE="">-Choix du Mois-
  <OPTION VALUE="janvier.php3">Janvier
  <OPTION VALUE="Février.php3">Février
  <OPTION VALUE="Mars.php3">Mars
  <OPTION VALUE="Avril.php3">Avril
  <OPTION VALUE="Mai.php3">Mai
  <OPTION VALUE="Juin.php3">Juin
  <OPTION VALUE="Juillet.php3">Juillet
  <OPTION VALUE="Aout.php3">Aout
  <OPTION VALUE="Septembre.php3">Septembre
  <OPTION VALUE="Octobre.php3">Octobre
  <OPTION VALUE="Novembre.php3">Novembre
  <OPTION VALUE="Decembre.php3">Decembre
</SELECT>
</FORM>

J'aimerais avoir la suite des codes html pour avoir un boutton ok et selon le mois selectioné on arrive à la page de ce mois.

Merci.

Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920
16 mars 2008 à 01:47

salut,

un bonjour ça ne fait jamais de mal.

pour le reste…

Discussions similaires

Statut « en ligne » alors que non

Que veut dire "correspondant occupé" lors d'un appel ?

[CSS] Forcé retour à la ligne

On me voit connecté sur facebook alors que je n'y suis pas

Discussions similaires

Newsletters