Discussion :

[lince102]

Code :

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

1
2
3
4
5
6
7
8
 
<td>
<form id="interventionForm" action="{$BASE_URL}/dossiers/cloreDevTermine/{$dossier.Dossier.id_dossier}" method="post" enctype="multipart/form-data">
<div class=buttons>
<center><input type="submit" value="{#ButtonDevTerminé#}" /></center>
</div>
</form>
</td>

J'aimerais savoir comment peut t on centrer un bouton dans un formulaire car avec les balises center cela ne fonctionne pas?

[Deallyra]

Bonjour,

Question de CSS et non pas de html

Il faut jouer avec les propriétés margin : 0,auto et avoir donné une taille au conteneur de l'élément en question

[Erwan31]

Attention l'élément center est un des élément déconseillés et invalide en
XHTML et HTML strict. Le remplacer soit par des marges auto au niveau de
l'élément à centrer, soit par un text-align:center sur le conteneur à
condition ce l'élément à centrer soit de niveau inline, ce qui est le cas ici.

Ton problème vient du fait que tu as oublié les guillements entourant la valeur:

class="buttons"

Corriger ça, supprimer l'élement center et mettre un text-align:center à ta classe buttons.


@Mimicracra Les marge auto ne sont appliquées qu'à des éléments de
niveau bloc (et plus généralement à des boîtes de bloc).
Il faudrait donc ici ajouter un display:block à l'input mais la solution que je propose est plus simple et moins lourde.

[HiRoN]

Ton problème vient du fait que tu as oublié les guillements entourant la valeur:
class="buttons"
Corriger ça et mettre un text-align:center à ta classe buttons.

+ 1 !

[lince102]

ben ca ne fonctionne pas pourtant j'ai mis dans mon css

Code :

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

1
2
 
#interventionForm div.boutons imput {text-align: center;}

Et

Code :

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

1
2
3
4
5
6
 
<form id="interventionForm" action="{$BASE_URL}/dossiers/cloreDevTermine/{$dossier.Dossier.id_dossier}" method="post" enctype="multipart/form-data">
<div class="boutons">
<input type="submit" value="{#ButtonDevTerminé#}" />
</div>
</form>

[Deallyra]

Bonjour,

#interventionForm div.boutons imput {text-align: center;}

tout est là

je te conseille :

Code :

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

1
2
 
#interventionForm .boutons input {text-align: center;}

[lince102]

J'ai essayé mais cela ne fonctionne toujours pas.

[NikoGJ]

Et avec ça? (autrement dit en appliquant le text-align sur le div et non sur le input)

Code :

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

#interventionForm .boutons {text-align: center;}

[lince102]

J'ai changé mon nom de form.

Le truc que je comprend pas c'est que quand je modifie la taille de l'input cela fonctionne correctement mais quand il faut le centrer dans la colonne du tableau ca ne fait rien du tout.

Code :

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

1
2
 
#devTermineForm input { width:95%;text-align:center;}

[lince102]

En fait ca marche sur internet explorer mais pas sur mozilla!

[lince102]

Si j'enleve les balises form ca fonctionne.
Pourquoi?

[Erwan31]

Oh là là! Le text-align n'était pas à appliquer à l'input (voir la remarque de NikoGJ) mais à son conteneur.

[lince102]

Ben voila la solution

Dans le css

Code :

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

1
2
 
#devTermineForm td	{text-align: center}

et dans l 'autre fichier

Code :

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

1
2
3
4
5
6
7
8
 
	<form id="devTermineForm" action="{$BASE_URL}/dossiers/cloreDevTermine/{$dossier.Dossier.id_dossier}" method="post" enctype="multipart/form-data">
				<td>
				<div class="boutons">
				<input type="submit" title="{#ButtonDevTermineAide#}" value="{#ButtonDevTermine#}" />
				</div>
				</td>
				</form>