La div ne s'étend pas à la largeur maximale

Question

J'ai la classe css suivante :

.CtractLabel
{
    font-weight:bold;
    padding: 2px;
    text-align:left;
    /* width:120px; */
    width:150px;
    float:left;
    border-bottom:solid 1px #aaaaaa;
    border-right:solid 1px #aaaaaa;
    background: white url('../Images/GridHeaderBg.gif') repeat-x bottom;
}

Sur ma page, j'ai une div avec du texte qui fait moins de 150px. Cependant, la div ne s'étend pas jusqu'à 150px, mais se contracte autour du texte. Existe-t-il un moyen de forcer la div à être exactement à 150px, quelle que soit la longueur du texte dans la div ?

Answer 1

La valeur par défaut de la largeur d'un div est auto ce qui a pour effet d'occuper tout l'espace disponible de manière horizontale.

Si vous n'obtenez pas ce comportement, il y a plusieurs causes possibles :

• Vous en avez fait un élément flottant.
• Vous avez spécifié une largeur d'une manière ou d'une autre, peut-être indirectement.
• Vous avez un autre élément qui prend de la place.

Pour voir exactement quel CSS s'applique à un élément et où se trouvent les éléments, vous pouvez utiliser le plugin FireBug dans Firefox.