Div de largeur 100%

Mammouth du PHP | 1353 Messages

31 mai 2010, 15:17

Bonjour,

A l'origine un besoin tout bête : j'ai une div de 500px dans laquelle je voudrais qu'il y ait une div avec bordure, le texte, puis une autre div avec bordure qui va jusqu'au bout, pour faire un effet comme celui la :

____Mon texte___________________
____Mon autre texte______________

Ainsi la div après le texte à une largeur variable mais s'arrête toujours au même endroit.
Je ne comprends pas comment réussir à faire ça, car si je met une largeur de 100% ca me met 100% de la div parent et non pas de la place restante... J'ai essayé différent display et tout mais je ne trouve pas, merci d'avance !

Code actuel :

Affichage :
<div class="bottom_border border_left"></div><h2 style="float:left; margin-left:-2px;">Mon texte</h2><div class="top_border border_right"></div><div style="clear:both"></div>
Le css :
.bottom_border {
border:none;
border-bottom:2px solid #E53C31;
height:21px;
}

.border_left {
display:block;
width:10px;
margin-left:0px;
float:left;
}

.border_right {
margin-left:-2px;
width:auto;
float:left;
}

.top_border {
display:block;
border:none;
border-bottom:2px solid #E53C31;
height:10px;
}
Bon c'est un tout petit peu plus compliqué que dans l'exemple car j'alterne entre des bordures hautes et basses, mais le soucis de largeur est exactement le même !

Merci d'avance.
Tell me and I forget. Teach me and I remember. Involve me and I learn.