Div de largeur 100% relativement au contenu

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 :

<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.

Merci mais ça ne change rien dans mon cas non plus

salut,
une div en block(pas en float) remplit automatiquement toute la largeur. partant de là tes besoins devraient être facilement réalisables.
mais je me permet de remarquer deux trois truc bizarres dans ton code. border_left a les propriété display:block et float:left, la deuxième annule la première je crois. pareil pour ta deuxième div qui possède deux classes avec ces propriétés.