xxxxxxxxxx
#header {
width: 100%;
background-color: red;
height: 30px;
}
#container {
width: 300px;
background-color: #ffcc33;
margin: auto;
}
#first {
width: 100px;
float: left;
height: 300px;
background-color: blue;
}
#second {
width: 200px;
float: left;
height: 300px;
background-color: green;
}
#clear {
clear: both;
}
<div id="header"></div>
<div id="container">
<div id="first"></div>
<div id="second"></div>
<div id="clear"></div>
</div>
xxxxxxxxxx
// side by side items with equal width
.parent {
display: flex;
}
.child {
flex: 1;
}
// your welcome