28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous !

J'ai un bloc "hautdepage" de 980px * 200px positionné en relatif et un élément h2 renfermant lui même un lien hypertexte <a>, je voudrais placer le h2 n'importe où dans le "hautdepage" mais que le lien occupe toujours les 980px * 200px, y'a t-il une solution ?

merci d'avance !
Bonjour,
Quelque chose comme ça?
[#black][b]HTML[/b][/#]

<div id="hautdepage">
<h2><a href="#">Mon lien</a></h2>
</div>


[#black][b]CSS[/b][/#]

#hautdepage {width:980px}
#hautdepage,#hautdepage h2 a {height:200px}
#hautdepage h2 a {display:block}
Peut-être...

Si je positionne maintenant le H2 en absolute et que je le met en haut à gauche, le lien occupera toujours la zone "hautdepage" ?
Ollivier a écrit :
Peut-être...
Peut-être?

Ollivier a écrit :
Si je positionne maintenant le H2 en absolute et que je le met en haut à gauche, le lien occupera toujours la zone "hautdepage" ?

Non il faudra ajouter:

#hautdepage {position relative; width:980px;}
#hautdepage h2 a {width:100%;}

Un élément en position absolue s'adapte à son contenu.
Modifié par Hermann (19 Mar 2008 - 14:17)
malheureusement, ça ne marche pas...
il n'occupe pas toute largeur et surtout toute la hauteur du bloc parent...
Voila qui aidera peut-être :

Code HTML :

<div id="hautpage">
<h2><a href="index.html">Mon texte<span>Descriptif</span> De mon site web <span>veersion beta</span></a></h2>
</div><!--Fin HAUTPAGE -->


Code CSS :

div#global {
position:relative;
margin:0 auto;
width:980px;
text-align:left;
background:url(images/bg_body.gif);
}

div#hautpage {
position:relative;
width:980px;
height:200px;
margin:0 auto;
text-align:left;
background:url(images/header.png) no-repeat;
}

#hautpage h2 {
position:absolute;
top:5px;
right:5px;
font-weight:100;
z-index:100;
}
#hautpage h2 span {
position:relative;
color:#fff;
}

Modifié par Ollivier (19 Mar 2008 - 15:03)