[Réglé] Problème puce pour site en arabe

Bonjour,

Je suis entrain de développer un site sous spip en langue arabe.
Le problème c'est que dans le menu, le image en background s'affiche à gauche, au lieu de s'afficher à droite.

Voici mon code en CSS

.ul1{
background-image: url(image/symbol_catagory.gif);
background-position:3px 12px;
background-repeat:no-repeat;
list-style-type:none;
line-height:14px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#000000;
padding-left:32px;
padding-top:9px;
}
.ul2{
background-image: url(image/symbol_scatagory.gif);
background-position:3px 12px;
background-repeat:no-repeat;
list-style-type:none;
line-height:14px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:normal;
color:#000000;
padding-left:13px;
padding-top:5px;
}
.menu {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#000000;
line-height:14px;
text-decoration:none;
}
.menu:hover {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:normal;
color:#444444;
padding-left:3px;
line-height:14px;
text-decoration: none;
}
.smenu {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:normal;
color:#000000;
line-height:14px;
text-decoration:none;
}
.smenu:hover {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:normal;
color:#444444;
padding-left:3px;
line-height:14px;
text-decoration: none;
}

Mon code sur la page html (avec le code spip pour ceux qui connaissent)

<BOUCLE_menu(RUBRIQUES) {racine} {par titre}>	
	<ul>				
  [<li class="ul1"><a href="#URL_RUBRIQUE" class="menu">(#TITRE|supprimer_numero)</a></li>]
<ul>				
<BOUCLE_sous_menu(RUBRIQUES) {id_parent} {par titre}>
<li class="ul2"><a href="#URL_RUBRIQUE" class=smenu>#TITRE</a></li>
</BOUCLE_sous_menu>					
</ul>		
</ul>
</BOUCLE_menu>	

Merci de votre aide
Modifié par El-annabi (17 Jun 2009 - 20:30)

Bonjour,

El-annabi a écrit :
Mon code sur la page html (avec le code spip pour ceux qui connaissent)

Du coup, ceux qui ne connaissent pas vont avoir plus de mal à t'aider... Il est toujours préférable de mettre le code HTML comme il apparait dans la source de la page qu'un code qui devra être interprété que ce soit du PHP ou du "code spip".

Pour ton problème, bien que je suppose ton sens de lecture soit de la droite vers la gauche, vient du fait que le CSS se positionnera à partir du coin supérieur gauche. Donc, apparemment pas comme tu l'espérait.

Bonjour,

background-position:3px 12px;

Tu demandes que ton image de fond soit placée à 3px du bord gauche et à 12px du bord haut de ton élément. Pour placer l'image de fond à droite, tu pourrais utiliser:

background-position: right 12px;

Par contre il n'y a pas de moyen simple de placer l'image de fond à 3px (ou autre valeur) du bord droit de l'élément.

Exacte Florent V.
Mais comme spip gère automatiquement les squelette, entre les site en langue " de gauche à droite" comme le français, et de "droite à gauche" comme l'arabe.

il fallait que je mette

background-position: left 12px;

Merci pour la piste.