If you have a sliced layout and don't have a cue about css positioning, it might be easier to use the tabling you have.
What's with your crazy colspans? And I'm not sure your plans for the what goes in the second row, under the second image.
If you want to do it "right" with all CSS...
To go in the header, or an externally referred CSS file.
Code:
html, body, #wrap {
width: 100%;
margin: 0px;
padding: 0px;
}
#ltop {
background-image: url(images/homePage_01.jpg);
width: 209px;
height: 149px;
position: relative;
float: left;
}
#mtop {
background-image: url(images/centre_Top.jpg);
width: 438px;
height: 92px;
position: relative;
float: left;
}
#rtop {
background-image: url(images/homePage_03.jpg);
width: 153px;
height: 149px;
position: relative;
float: left;
}
.clear {
clear: both;
}
To go in your html file.
Code:
<div id="header">
<div id="ltop"></div>
<div id="mtop"></div>
<div id="rtop"></div>
<div class="clear"></div>
</div>