Grid System
HTML
<div class="box full">Full Width</div>
<div class="container">
<div class="box half"><-- Get Rid of this margin (Half Width)</div>
<div class="box half">Half Width</div>
</div>
CSS
.container {
position: relative;
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
background-color: black;
}
img {
max-width: 100%;
}
.image {
width: 100%;
}
.box {
margin: 1% 0 1% 0;
float: left;
background-color: gray;
box-sizing: border-box;
color:white;
}
.full {
width: 100%;
margin-left: 0;
}
.container .half {
width: 45%;
margin-left: 1%;
border:1px solid red;
}
.container .half:first-of-type {
margin-left: 0;
border:1px solid green;
}