Salut benjy,
Effectivement avec un HR c'est possible, d'ailleur après ton post je l'ai essaié et ça fontionne nickel sur Firefox mais internet explorer 7 ... bah c'est la cata.
Je dois travailler avec des positions absolute pour le HR et le petit texte "Spécialiste Cuisines", et le comportement n'est pas du tout le même sous IE7 (J'ose même pas essayer avec un IE < 7).
Le code html et css ci-dessous fonctionne parfaitement avec Firefox 2.x. Meme lors d'un [CTRL] + [SCROLL] ça s'agrendit comme il faut.
J'ai 2 sollution:
- Je me casse la tête à le faire fonctionner sur la pluspart des browsers
- Je laisse l'image, mais lors d'un zoom (sauf IE7) l'image ne s'agrendira pas.
HTML Code:
<div id="introduction">
<h1>Dekeyser SA</h1>
<hr />
<h2>Spécialiste en Cuisines</h2>
</div>
Code:
#introduction {
margin: 5em auto;
width: 40em;
}
#introduction h1 {
font-family: verdena, serif;
font-size: 4.8em;
text-align: center;
color: rgb(32, 65, 98);
}
#introduction h2 {
font-family: verdena, serif;
font-size: 1.1em;
position: absolute;
top:9em;
color: rgb(32, 65, 98);
margin: 0 0 0 19em;
}
#introduction hr {
position: absolute;
top:8.68em;
border: rgb(32, 65, 98) thin solid;
width: inherit;
}
Firefox
IE 7