28172 sujets

CSS et mise en forme, CSS3

Listes numérotée

Bonjour, voici un problème que je n'arrive pas à résoudre et sur lequel j'ai déjà crisé pas mal de temps Smiley bawling

le code est le suivant:


<html>
<head>
</head>
<body>
<ul style="list-style-type:decimal;list-style-position:inside;" >
<li style="background-color:#f00;"><a style="float:right;">link</a>element</li>
</ul>
</body>
</html>


Mon problème est simple, je souhaiterai que le lien se place tout en haut à droite de l'élément de la liste (zone rouge) or celui-ci passe en dessous sous FF (pas de pb sous IE6). Curieusement, il me suffit de modifier le list-style-position en "outside" et la, tout va bien. Si quelqu'un a une idée.

A noter qu'il faut absolument que ce lien soit contenu dans l'élément <li>.

J'ai contourner le pb en utilisant un position:relative sur le <li> et un position:absolute avec un right à 0 sur le <a> mais je trouve ça un peu pourri. Le float c'est quand même plus classe.

Merci d'avance Smiley biggrin
Bonjour slash et bienvenue Smiley cligne ,

Serait-il possible d'avoir le code exact (css et html) et éventuellement une page en ligne pour vraiment pouvoir se faire une idée du problème.
Dsl mais je ne peux mettre un accès en ligne. De plus code complet est bcp trop long (c'est du code généré par .net). J'ai préféré mettre juste un code basique qui reproduit fidèlement le problème. Y'a juste a copier et coller le code ci-dessous dans un fichier html. Dsl ne pas pouvoir proposer mieux Smiley smile

J'ai regroupé les valeurs des attributs styles des éléments dans une balise style css si cela peut faciliter les tests


<html>
<head>
<style>
ul{
	list-style-type:decimal;
	list-style-position:inside;
}
li{
	background-color:#f00;
}

a{
	float:right;
}

</style>
</head>
<body>
<ul>
	<li><a>link</a>element</li>
</ul>
</body>
</html>


rci d'avoir répondu si vite Smiley biggrin
Sujet clos
Aller à