Dépannage informatique à domicile NCT Micro
  Cliquez ici pour vous abonner à ce flux RSS  

Un texte centré


Codage CSS de l'exemple:

/* corps de page de couleur bleue */
body {
background-color: #297cbc;
}

/* Le conteneur doit avoir une position relative */
div#conteneur {
position: relative;
width: 300px;
height: 100px;
background: yellow;

}

/* Le conteneur de paragraphe est en position absolue, avec des marges négatives pour le centrage (moitié de la hauteur du paragraphe) */
div#conteneur p {
position: absolute;
top: 50%;
height:50px;

/*centre le texte dans le conteneur*/
line-height: 50px;
/* (décalage de la moitié de la largeur de l'objet) */
margin-top: -25px;
background: orange;

}

Code HTML pour afficher le style CSS

<html>
< head>
< style type="text/css"> @import url(style/background.css);</style>
< /head>
< body>
<div id="conteneur">
< p>Un texte centré</p>
< /div>
< /body>
< /html>