[Résolu] Liste ul et cercle css3

Auteur
speedlab	# 21 Mar 2010 - 18:15:04
<speed /> 178 Posts	Bonjour, Je souhaitais tester les cercles en css3. Grâce au très bon article de Riku Asakura, j'obtiens un cercle grâce au code suivant: `#cercle { width: 150px; height: 150px; background-color:#33FFCC; -moz-border-radius: 75px; -webkit-border-radius: 75px; -khtml-border-radius: 75px; border-radius: 75px; }` Mais je tombe sur un écueil si je veux faire, admettons, une liste horizontale faite de cercles… Ce code fonctionne `#menu li { float: left; width: 150px; height: 150px; background-color:#33FFCC; -moz-border-radius: 75px; -webkit-border-radius: 75px; -khtml-border-radius: 75px; border-radius: 75px; }` Mais si je remplace le float: left; par un display: inline; je n'ai plus mes cercles. quelqu'un aurait une explication à ça? Modifié par speedlab (21 Mar 2010 - 18:23)
<speed /> 178 Posts
speedlab	# 21 Mar 2010 - 18:23:41
<speed /> 178 Posts	Ooops, je me réponds, j'avais fait une erreur de frappe dans le code (x)HTML. Message à jeter… Pas bon de bosser un dimanche de printemps
<speed /> 178 Posts
fvsch	# 21 Mar 2010 - 19:40:40
Administrateur 19942 Posts	Il y a aussi le fait qu'un élément en display:inline ne peut pas avoir de hauteur ou largeur fixe (les propriétés width et height seront ignorées). Si tu veux pouvoir utiliser width et height tout en gardant certaines caractéristiques du "inline", il faut regarder du côté de display:inline-block. C’est ça, la puissance intellectuelle. Bac + 2, les enfants.
Administrateur 19942 Posts
speedlab	# 22 Mar 2010 - 10:49:44
<speed /> 178 Posts	Merci pour la précision, Florent. Mais n'y a t'il pas des écueils d'utilisation de display:inline-block, notamment avec IE? Je crois avoir lu ça sur l'article de Raphael...
<speed /> 178 Posts
Heyoan	# 22 Mar 2010 - 11:22:25
Modérateur 8101 Posts	Salut, speedlab a écrit : Mais n'y a t'il pas des écueils d'utilisation de display:inline-block, notamment avec IE? Yep ! Mais Florent a trouvé la parade (testée et approuvée) : http://covertprestige.info/css/inline-block/ Éléments html, hiérarchie XHTML 1.0 Strict et propriétés CSS
Modérateur 8101 Posts
fvsch	# 22 Mar 2010 - 14:03:55
Administrateur 19942 Posts	Heyoan a écrit : Mais Florent a trouvé la parade De mémoire j'ai eu l'info par gc-nomade sur ce forum. La paternité de l'astuce est sans doute attribuable à un autre encore. Pour info, les astuces données pour Firefox 1 et 2 sont assez obsolètes aujourd'hui, avec un Firefox 2.0 en dessous de la barre des 1% de parts de marché. C’est ça, la puissance intellectuelle. Bac + 2, les enfants.
Administrateur 19942 Posts