28173 sujets

CSS et mise en forme, CSS3

Bonjourtout le monde,
Voila je voudrai faire appraitre un petit carré devant chaque element d'un menu.

Voici mon code :

ul{
	list-style-type: none;
}
li {
	background-color:#00CCFF;
	float:left;
	width: 200px;
	margin-right: 20px;
}
li:before{
	display: block;
	float: left;
	width: 15px;
	height: 15px;
	background-color: #EEEEEE;
	content: "";
}

Le problème est que le float:left; ne fonctionne pas et que le texte se retrouve en dessous du carré.

Avous-vous une idée ?

Manu
Bonjour,

Si tu t'orientes vers une solution via une pseudo-élément tu as donc bien conscience que "le petit carré" ne sera pas disponible pour tout le monde compte tenu du support de ":before" et ":after".

Le plus simple serait d'utiliser:

-la valeur "carré" pour les puces;
-une images d'arrière plan avec un text-indent;
-une image html;