Comment centrer au milieu de l'écran un élément ?

**andrianiaina** · 05/08/2011, 13h19

Bonjour à tous,

J'aimerai placer un bouton au plein centre de l'écran. Comment faire ?

Merci

**Gaetan_** · 05/08/2011, 13h55

Bonjour,

Tu peux te prendre la tête avec du css ou faire simple :

Code :

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

1
2
3
4
5
6
 
<TABLE WIDTH="100%" HEIGHT="100%">
<TR>
<TD VALIGN="center" ALIGN="center">toto</TD>
</TR>
</TABLE>

Invité · 05/08/2011, 14h17

Houla Gaetan_ ! Tu as fait un "retour dans le passé" ou quoi ??
Marty MacFly ! Sors de ce corps !!

Centrer les éléments ou un site web en CSS

**Gaetan_** · 05/08/2011, 14h30

Hehehe

Sérieusement parfois il ne faut pas être plus royaliste que le roi.

Les tables rendent encore des services ! oui oui.

centrer une div verticalement c'est 10 lignes de code.

edit : rhooo ca va hein

je peux le faire en ascii art aussi

**Bovino** · 05/08/2011, 14h36

Envoyé par Gaetan_

Les tables rendent encore des services ! oui oui.

Tout à fait ! Elles permettent d'afficher des données tabulaires

**Gaetan_** · 05/08/2011, 14h38

HANNNN !!!
Il y a une cabale contre moi.

Invité · 05/08/2011, 14h41

Envoyé par Gaetan_

Les tables rendent encore des services !

Je veux bien, mais de là à écrire les balises en MAJUSCULES ! comme au siècle dernier !! rôôôôh le vilain !

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<style type="text/css">
        #lebloc { 
          position:absolute; 
          left: 50%;  
          width: 150px; 
          margin-left: -75px; /* moitié de la largeur */ 
          top: 50%; 
          height: 30px; 
          margin-top: -15px; /* moitié de la hauteur */ 
          text-align: center; /* centrage du texte */
          /* options */
          border: 1px solid #000; 
          background: #abc;
        }
</style>
</head>
<body>
	<div id="lebloc">ici le bouton</div>
</body>
</html>

PS : pour ta défense (mais est-ce défendable ? ), il m'est arrivé de le faire aussi avec une table !! shame on me ...

**Bovino** · 05/08/2011, 14h43

Envoyé par jreaux62

Je veux bien, mais de là à écrire les balises en MAJUSCULES ! comme au siècle dernier !! rôôôôh le vilain !

C'est toute la beauté du HTML (comparé au xhtml) : il ne respecte rien !
Imagines-toi qu'en HTML5, les balises <html>, <head> et <body> sont facultatives !