My parent Div needs to extend with all the children. The children divs are multiple buttons that's x position is incremental.
Example
div id="Parent"
div id="Child" /div {X-position : 90}
div id="Child2" /div {X-position : 180}
/div
Any Ideas will be much appreciated
You can do it by setting the display: inline-block;
or display: table;
to the parent div, and then it will fit the size of its children:
.Parent{
background-color:red;
display:inline-block;
/* display: table;*/
}
.Child{
background-color:blue;
width:50px;
heigth:50px;
}
You can see the demo here:
.parent{
background-color:red;
display:table;
}
.child{
background-color:blue;
width:50px;
height:50px;
}
<div class="parent">
<div class="child">bbb</div>
<div class="child">aaa</div>
<div class="child">bbb</div>
<div class="child">aaa</div>
<div class="child">bbb</div>
<div class="child">aaa</div>
</div>