Partage
  • Partager sur Facebook
  • Partager sur Twitter

"Inverser" une liste

Pour un menu situé à droite de la page

15 mars 2006 à 20:34:32

Bonjour à tous !
Je cherche le moyen le plus simple possible d'inverser une liste de menu, sur ce site : http://lotrbfme.free.fr/test

Au passage, si vous saviez comment faire pour les titres de menu à droite toujours, pour que ca fasse comme les listes et si vous pouviez donner votre avis sur le design ca me ferait plaisir :)

Voila merci d'avance @++
  • Partager sur Facebook
  • Partager sur Twitter
16 mars 2006 à 0:43:32

Bonjour,

Le design est extrêment très simple, aucune image, juste de la couleur ^^

Pour ce qui concerne du code xhtml/css, tu pourrais mieux faire. Utilises les <h1>, <h2> etc .. au lieu d'ajouter des div !!

Dans ta feuille de style :

remplace :

.contenu_menu_droite ul
{
        list-style-type: none;
        padding-top: 10px;
        text-align: right;
}


par :

.contenu_menu_droite ul
{
        list-style-type: none;
        padding-top: 10px;
        text-align: right;
}


remplace :

.titre_menu_droite
{
   float: left;
   text-indent:15px;
   text-align: right;
   width: 154px;
   border-bottom: 1px solid;
   border-color: black;
   background-color: rgb(245,252,197);
   font-size: 1.3em;
}


par :

.titre_menu_droite
{
   float: left;
   text-indent:15px;
   text-align: left;
   width: 154px;
   border-bottom: 1px solid;
   border-color: black;
   background-color: rgb(245,252,197);
   font-size: 1.3em;
}

  • Partager sur Facebook
  • Partager sur Twitter
16 mars 2006 à 7:59:54

Merci de ton avis :)

Pour les listes, le code que tu me proposes est exactement le meme que celui qui existe déjà^^
Et pour le menu, ca ne l'aligne pas à droite, ca l'aligne à gauche
  • Partager sur Facebook
  • Partager sur Twitter
16 mars 2006 à 8:32:11

Ah oui, mince je me suis trompé :

Remplace :

.contenu_menu_droite ul
{
        list-style-type: none;
        padding-top: 10px;
        text-align: right;
}


par :

.contenu_menu_droite ul
{
        list-style-type: none;
        padding-top: 10px;
        text-align: left;
}
  • Partager sur Facebook
  • Partager sur Twitter
16 mars 2006 à 8:55:46

Slt,

un petit
#menuEnQuestion li{
float:right;
}
devrait faire l'affaire.

++
  • Partager sur Facebook
  • Partager sur Twitter
16 mars 2006 à 15:11:13

Oué effectivement ca marche mieux, avec quelques réglages à coup de padding, merci^^

Mais comment faire pour que les titres ne soient pas collés à la bordure de droite et soient pourtant écrits à droite ?
Un padding ne marche pas, la bordure de gauche étant du coup décalée
  • Partager sur Facebook
  • Partager sur Twitter
17 mars 2006 à 18:34:09

Et bien un margin peut être :)
  • Partager sur Facebook
  • Partager sur Twitter
17 mars 2006 à 18:58:51

Non plus^^
Mais en mettant un padding de l'autre coté ca passe
Mais devinez quoi ?
Ca marche pas sous IE !!!
...

Donc s'il existe une fonction, j'aimerais bien l'avoir^^
  • Partager sur Facebook
  • Partager sur Twitter
17 mars 2006 à 19:30:26

Heu fait gaffe, un élément en display:block; (dont ton <ul/>) à le comportement par défaut d'un élément display:block; (sisi c'est vrai !) c'est à dire qu'il prend 100% de la largeur de son bloc conteneur, surement le <body/> dans ton cas. Donc pour débugger, met la bordure de ton <ul/> en rouge par exemple (
ul#menu{
border:thin solid red;
}
) et tes <li/> en bordure verte par exemple. Ensuite, tu peux essayer un
ul#menu{
width:96%;
}
mais ce qui est sûr, c'est que c'est plus facile avec le site sous les yeux !

++
  • Partager sur Facebook
  • Partager sur Twitter
17 mars 2006 à 19:43:42

http://lotrbfme.free.fr/test
Je vais essayer ce que tu m'as dit merci
  • Partager sur Facebook
  • Partager sur Twitter

"Inverser" une liste

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
  • Editeur
  • Markdown