Bonsoir,
Je me suis permis de "simplifier" un peu la page HTML et le CSS. Ci-après alors ma proposition:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
| <html>
<head>
<title>Essai</title>
<style type="text/css">
div#titre_principal { position: relative; overflow: auto; }
div#titre_principal img { display: block; float: left; }
div#titre_principal p { text-align: center; }
</style>
</head>
<body>
<header>
<div id="titre_principal">
<img src="http://www.iprotek.net/_img/logo_iprotek.png" alt="Logo de IProTek" id="logo" />
<p>Tel : <a href="tel:418-263-3090">418 263-3090</a></p>
<p>Sans frais <a href="tel:1-855-263-3090">1 855 263-3090</a></p>
</div>
</header>
</body>
</html> |
Le principe:
1. un div #titre_principal qui sera le conteneur global par rapport auquel tous les autres éléments qu'il contient vont se référer.
Code css :
div#titre_principal { position: relative; overflow: auto; }
2. dans ce conteneur global, le logo sera positionné à gauche et le reste à droite.
Code css :
div#titre_principal img { display: block; float: left; }
3. le texte contenu dans <p> sera centré.
Code css :
div#titre_principal p { text-align: center; }
En espérant de t'avoir aidé.
Cordialement,
Mahefasoa
Partager