How to force parent div to expand by child div width/padding/margin/box?

Question

I want to expand div parent with child div but I don\'t know if that\'s possible and how to do it.

Answer 1

The key solution to your problem is to use display:inline-block;

HTML

    
One
    
Two

CSS

body {
    background: gray;
}
div.page {
    color: white;
    background: black;
    margin: auto;
    padding: 1em;
    display:inline-block;
}
div.one {
    background-color: red;
    width: 10em;
    display:inline-block;
}
div.two {
    background-color: green;
    width: 40em;
    display:inline-block;
}

Here is the working fiddle