Page 1 sur 1
alignement
Posté : 27 août 2006, 09:22
par DARDI
bonjour,
je n'arrive pas à centrer verticalement le texte dans la cellule... voici le code... quelqu'un peut-il me dire où ça "cloche"... merci...
Code : Tout sélectionner
<HEAD>
<style type="text/css">
h1{font-style: italic;
font-family: times new roman;
color: green;
font-size: 20px;
text-align: center;
}
#Positionnement{position: absolute;
left: 50px;
top: 100px;
width: 200px;
height: 0px;
background-color:white;
}
</style>
</HEAD>
<BODY>
<TABLE BORDER=2 BGCOLOR="#COCOCO" ALIGN=center BORDERCOLOR="red" CELLSPACING=4>
<TR>
<TD id="Positionnement"><h1>TITRE</h1></TD>
</TR>
</TABLE>
</BODY>
Posté : 27 août 2006, 09:35
par cartfield
salut
essaie d'enlever id "positionnement" au début de ton tableau car il le prend en premier donc c'est là dessus que ce base ton code pour faiire la mise en forme
car dans positionnement tu choisi de mettre ton txte à gauche
Posté : 27 août 2006, 09:54
par Cyrano
vertical-align: middle
Ça devrait résoudre ton problème
alignement
Posté : 27 août 2006, 17:18
par DARDI
merci pour vos réponses... mais... pour cartfield, je n'ai pas de souci horizontalement... c'est verticalement que ça ne va pas... essai le code pour voir... pour Cyrano, j'ai beau essayer vertical-align: middle à toutes les sauces... rien à faire... mon texte reste scotché en haut de ma cellule... au secours... merci par avance...
Posté : 27 août 2006, 18:46
par Cyrano
Vire la marge externe autour du bloc H1.
D'autre part, positionner une cellule de tableau en absolute est complètement inutile.
Correction version HTML 4:
Code : Tout sélectionner
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<!-- Date de création: 27/08/2006 -->
<head>
<style type="text/css">
<!--
h1{
font-style: italic;
font-family: times new roman;
color: green;
font-size: 20px;
text-align: center;
margin: 0;
}
#Positionnement{
width: 200px;
height: 0px;
background-color:white;
vertical-align: middle;
}
-->
</style>
</head>
<body>
<table border=2 bgcolor="#COCOCO" align=center bordercolor="red" cellspacing=4>
<tr>
<td id="Positionnement"><h1>TITRE</h1></td>
</tr>
</table>
</body>
</html>
Correction version XHTML 1.0 :
Code : Tout sélectionner
<?xml version="1.0" encoding="iso-8859-1" ?>
<!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">
<!-- Date de création: 27/08/2006 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" xml:lang="fr" />
<title></title>
<meta http-equiv="Content-language" content="FR-fr" xml:lang="fr" dir="ltr" />
<style type="text/css">
/* <![CDATA[ */
h1{
font-style: italic;
font-family: times new roman;
color: green;
font-size: 20px;
text-align: center;
margin: 0;
}
#Positionnement{
width: 200px;
height: 0px;
background-color:white;
vertical-align: middle;
}
/* ]]> */
</style>
</head>
<body>
<table border="2" bgcolor="#COCOCO" align="center" bordercolor="red" cellspacing="4" summary="">
<tr>
<td id="Positionnement"><h1>TITRE</h1></td>
</tr>
</table>
</body>
</html>
Proposition en virant tout simplement la mise en page en tableau HTML :
Code : Tout sélectionner
<?xml version="1.0" encoding="iso-8859-1" ?>
<!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">
<!-- Date de création: 27/08/2006 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" xml:lang="fr" />
<title></title>
<meta http-equiv="Content-language" content="FR-fr" xml:lang="fr" dir="ltr" />
<style type="text/css">
#Positionnement{
position: relative;
width: 200px;
top: 0;
left: 50%;
margin-left: -100px;
background-color: #ccc;
vertical-align: middle;
border: 1px solid #f00;
padding: 3px;
}
/* <![CDATA[ */
#Positionnement h1{
font-style: italic;
font-family: times new roman;
color: green;
background-color: #fff;
font-size: 20px;
text-align: center;
margin: 0;
border: 1px solid #000
}
/* ]]> */
</style>
</head>
<body>
<div id="Positionnement">
<h1>TITRE</h1>
</div>
</table>
</body>
</html>
alignement
Posté : 28 août 2006, 10:59
par DARDI
merci Cyrano... en ajoutant margin: 0px ou autre taille, mon texte se centre bien verticalement... a+...
Posté : 18 mars 2007, 20:02
par lacfab
suis je le seul chez qui ça marche pas cet alignement centré ??
Code : Tout sélectionner
.titre {font-size : 12pt;
color: #ffd;
font-weight: bold;
text-align: center;
margin: 0px;
}
rien à faire j'ai farfouillé ce forum et essayé moultes choses ça bronche pas.