28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

je cherche à créer un style css pour un titre qui aurait l'aspect indiqué sur l'image jointe.
Je galère depuis quelques heures...
quelqu'un aurait une bonne idée ?
Merci! upload/59210-titre.gif
Modérateur
Bonjour,

On la voit souvent revenir cette barre derrière le titre ! Smiley langue Ça mériterai limite un article officiel made by Alsacreations !
Cet exemple reste plus simple car tu as un fond derrière ton texte. Du coup je te propose à la volée un truc comme ça :
<h1 class="title"><span>Titre</span></h1>

.title{
    position:relative;
    text-align:center;
}
.title::before{
    content:"";
    position:absolute;
    top:50%;
    left:0;
    width:100%;
    background:#a9c622;
    height:2px;
    z-index:-1;
}
.title span{
    background:#a9c622;
    padding:4px 8px;
}

http://fiddle.jshell.net/nw49qcqg/

Mais il doit y avoir 42 façon différente de faire ça...

Bon code Smiley murf