28172 sujets

CSS et mise en forme, CSS3

[RESOLUT]J'ai juste mis un display inline dans le h3 qui permet d'enlever la max width

--------------
Bonjour
La question n'est pas très révélatrice mais l'image en pièce jointe le sera plus.
En fait j'ai déjà fait un essai mais j'ai peur que ça ne marche pas avec tous mes titres qui seront dynamiques.
Je voudrais mettre en fond de mes titres la partie hachurée bleue, sur toute la longueur mais sous le texte du titre je voudrais mettre du blanc.
voilà ce que j'ai fait :

<div id="about">
<div id="title"><h3>A la une</h3></div>
</div>


#about #title{
background:url(images/bg_titre_hachure.png) repeat-x right bottom; 
height:30px;  
margin-bottom: 25px
;}

#about h3 { 
background:#FFFFFF;
max-width: 250px; 
padding:0;
color:#273556; 
font-family:league gothic; 
font-size:38px;}


Y a t'il une meilleure façon de faire , car j'ai peur qu'avec la mienne sur un grand titre le blanc ne fonctionne pas comme je voudrais
Merci
Nadège upload/44507-moyen.jpg
Modifié par nadege21 (15 Aug 2013 - 09:18)
salut,
avec ton code, tu dépendras de la largeur du titre est ce n'est donc pas dynamique. Une alternative :

<h3><span>Mon titre dynamique</span></h3>


h3 {font:38px league gothic, sans-serif;color:#273556}
h3 span {float:left}
h3:after {content:".";overflow:hidden;display:block;color:transparent !important;background:url(images/bg_titre_hachure.png) repeat-x right bottom}
Merci beaucoup c'est exactement ce que je voulais
je n'avais pas du tout penser à overflow:hidden;
Bonne journée