Discussion :

[dream_of_australia]

Coucou tout le monde,

Alors une petite question, qui semble bête :
J'ai un div dans lequel je veux mettre une image plus des div "boutons" (avec un encadrement css). Le nombre de "boutons" dépend de la base de données. Je voudrais que cette ligne soit centrée, mais pour le moment elle n'est alignée qu'à gauche.

Dans ma page (c'est un exemple, car il peut y avoir plus de boutons)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<div id="choix"><img src="images/choix.gif" style="float:left;" />
   <div class="boutoncat">Nom categorie 1</div>
   <div class="boutoncat>Nom categorie 2</div>
</div>

Dans le code css :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
#choix {
	padding:0;
	border-style:none;
	margin-top:30px;
	margin-right:auto;
	margin-bottom:0;
	margin-left:auto;
	height:20px;
	width:751px;
	text-align:center
}
 
.boutoncat {
	padding:5px;
	border-style:outset;
	border-width:thin;
	border-color:#6633CC;
	text-align:center;
	margin-top:0;
	margin-right:0;
	margin-bottom:0;
	margin-left:20px;
	font-family: Arial, Helvetica, sans-serif ;
	font-size: 14px ;
	color:#CCCCCC;
	font-weight:bold;
	height:20px;
	width:auto;
	background-color:#370082;
	float:left
}

Je pense que mon problème vient des float:left, mais si je les enlève, ils se mettent les uns en dessous des autres.

[dream_of_australia]

Résolu par des display:inline au lieu des float:left.