xHTML/CSS: Comment faire div intérieure obtenir une largeur de 100% - les marges

Question

J'ai 2 divs imbriqués et une externe a une largeur: 100%

<div id="#outer" style="width:100%; border:1px"> 
    <div id="#inner" style="width:100%; border:1px; margin:4px"> 
    something inside ... 
    </div> 
</div> 

Mais dans ce cas div intérieure est supérieure à la largeur de externe par 8px (marges). Comment faire div interne pour obtenir la largeur de div externe moins 8px marge?

P.S. Tous les styles sont dans des classes séparées dans mon cas, ici j'ai mis CSS en attributs de style juste pour la simplification.

Answer 1

Emportant la largeur de la div intérieure devrait fonctionner, width: auto; travaillera avec des marges, et d'étendre à la zone horizontale maximale:

<div id="#outer" style="width:100%; border: solid 1px red;"> 
    <div id="#inner" style="border:solid 1px green; margin:4px"> 
    something inside ... 
    </div> 
</div> 

Answer 2

Voici quelques styles qui fonctionnent si vous supprimez ceux directement sur la éléments. J'ai utilisé auto sur le CSS interne et une marge droite = 8px. Pour le rendre plus facile à voir, j'ai fait le vert intérieur et le noir extérieur.

#outer 
    { 
     width: 100%; 
     border: 1px solid black; 
    } 

    #inner 
    { 
     width: auto; 
     border: 1px solid green; 
     margin-right: 8px; 
    }