Formatting images in CSS div table

I'm still learning CSS and page formatting and stuck. Would really appreciate some help.

To make this short here is what I'm trying to achieve:

enter image description here

And this is what I'm getting instead:

enter image description here

I seem to have tried everything. Here is the code:

<div class="header-parent">

<div class="header-first-column">
  <div class="header-cell" id="header-img1">
  <img src="../../Content/images/header/header_img1.jpg" />
  </div>
  <div class="header-cell" id="header-img2">
  <img src="../../Content/images/header/header_img2.jpg" />
  </div>
</div>

<div class="header-second-column">

 <div class="header-cell" id="header-img3">
 <img src="../../Content/images/header/header_img3.jpg" />
 </div>
 <div class="header-cell" id="header-img4">
 <img src="../../Content/images/header/header_img4.jpg" />
 </div>

</div>

<div class="header-third-column">
    <div class="header-cell" id="header-img5">
    <img src="../../Content/images/header/header_img5.jpg" />
    </div>
</div>

<div class="header-fourth-column">
    <div class="header-cell" id="header-img6">
    <img src="../../Content/images/header/header_img6.jpg" />
    </div>
    <div class="header-cell" id="header-img7">
    <img src="../../Content/images/header/header_img7.jpg" />
    </div>
</div>

And CSS:

.header-parent
{
    width:900px;
    top:10px;
    position:absolute;
    margin-left:auto;
    margin-right:auto;
    }

.header-first-column
{
    width:219px;
    background-color:White;
    float:left;
    display:block;
}


.header-second-column
{
    width:285px;
    background-color:White;
    float:left;
    display:block;
}

.header-third-column
{
    width:158px;
    background-color:White;
    float:left;
    display:block;
}


.header-fourth-column
{
    width:220px;
    background-color:White;
    float:left;
    display:block;
}

The images themselves I tried formatting with their IDs directly such as:

#header-img1
{
    padding:0 0 0 0;
    text-align:center;
}

I tried adding margins, padding, floating images left. Nothing seems to work. Help?

Solution

add some margin to the <div>

.header-second-column, .header-third-column, .header-fourth-column
{
    margin-left: 10px;
}