Problème pour centrer un formulaire sur FF

**Oberown** · 28/11/2007, 14h41

Bonjour,

J'ai une page où je veux que mon formulaire soit au milieu de la page. Ca marche sur IE, mais pas sous Firefox. Quelqu'un aurait une petite idée ?

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"> 
<head> 
<title>Titre</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
body {
text-align:center;
height:100%;
margin:0pt;
padding:0pt;
width:100%;
}
 
div.AligneCentre {
text-align:center;
}
 
 
-->
</style>
</head>
<body>
<div class="AligneCentre">
<form action="a.php" method="post">
	<table>
		<tr>
			<td>
				Toto
			</td>
			<td>
				<input type="text" name="toto" value=""/>
			</td>
		</tr>
		<tr>
			<td>
				Titi est très content
			</td>
 
			<td>
				<input type="text" name="titi" value=""/>
			</td>
		</tr>
	</table>
</form>
<br />
<a>Milieu</a>
</div>
</body>
</html>

**BnA** · 28/11/2007, 14h43

Salut!

Visite ceci: Centrage d'éléments CSS

Avec ça, tu saura centrer n'importe quoi!

**Oberown** · 28/11/2007, 14h57

Ca ne me convient pas car il faut spécifier une width au bloc à centrer.
Car le texte et le formulaire peuvent être de n'importe quel taille.

**BnA** · 28/11/2007, 15h05

Bah, faut toujours fixer une largueur maximale, sinon tes utilisateurs risquent de se retrouver avec une scrollbar horizontale...

Maintenant, c'est la méthode que j'utilise, et là comme ça, je vois pas d'autres solutions, donc...

**MasterOfChakhaL** · 28/11/2007, 20h04

Salut,

Dans la FAQ, il est indiqué qu'il faut indiquer une largeur car vu que les éléments block ont une largeur par défaut de 100%, tu aurais beau le centrer que l'affichage ne serait pas modifier.

Il se trouve que les tableaux n'ont pas cette largeur par défaut. Tu peux donc te passer de la largeur et utiliser la technique décrite dans la FAQ...

Code html :

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
32
33
34
35
36
37
38
39
40
41
42
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"> 
<head> 
<title>Titre</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
#centre{
        border:1px solid black;
        margin-left: auto;
        margin-right: auto;
}
 
 
-->
</style>
</head>
<body>
<form action="a.php" method="post">
	<table id="centre">
		<tr>
			<td>
				Toto
			</td>
			<td>
				<input type="text" name="toto" value=""/>
			</td>
		</tr>
		<tr>
			<td>
				Titi est très content
			</td>
 
			<td>
				<input type="text" name="titi" value=""/>
			</td>
		</tr>
	</table>
</form>
</body>
</html>

EDIT:

Envoyé par BnA

Bah, faut toujours fixer une largueur maximale, sinon tes utilisateurs risquent de se retrouver avec une scrollbar horizontale...

Ben c'est faux... la scrollbar a plus de chance d'apparaitre quand tu imposes une largeur.
Si tu définis une largeur et que la fenetre est plus petite, alors tu es sur de voir ta scrollbar. En revanche, si tu fais un design fluide, tes éléments vont se réagencer pour éviter justement l'apparition de la scrollbar...

**cadoudal56** · 29/11/2007, 11h00

Hello,

Mais pourquoi ne pas utiliser <center></center> tout simplement ?
Certains puristes diront que cette balise est vouée a disparaitre, mais vouée a disparaitre ne veut pas dire qu'elle a disparue...

@+
cadou

**MasterOfChakhaL** · 29/11/2007, 11h35

Je ne pense pas que ce soit une question d'être puriste ou pas.

Le jour où finalement tu voudras que le tableau soit aligné à gauche, tu seras bien content de n'avoir qu'à modifier une ligne de CSS plutôt que de partir à la chasse à la balise CENTER dans je ne sais combien de page html...

De plus, si tu utilises du css, il n'est vraiment pas bon de mettre de la mise en forme à plusieurs endroits du code, ton CSS ne s'appliquera pas comme tu l'entends, et au bout de X temps, tu te diras satanées balise center, ca fait une heure que j'essaie de corriger mon css alors qu'il était correct dès le début (c'est du vécu).

Et puis on est sur le forum CSS, donc à priori la réponse attendue devait être en CSS...

Problème pour centrer un formulaire sur FF

Centrer un élément en CSS

Discussions similaires

Partager

Partager