You can try doing the below
1)Remove the table
2)Replace your table columns
with div
and float
the divs
3)clear
the floats
after the end
of the div
, so it does not screw your footer.
HTML :
<div class="content">
<div class="column-1">
<p><b>Welcome!</b></p>
<p>Lorem Ipsum is the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>
<div class="column-2">
<p><img src="https://stackoverflow.com/questions/20018606/location.png" alt="location"></p>
<p><iframe src="">....</iframe> </p>
</div>
<div class="clr"></div>
</div>
<div class="clr"></div>
<div class="footer"> Copyright </div>
CSS:
.column-1{
float:left;
width:60%; }
.column-2{
float:right;
width:40%;}
.clr{
clear:both;
}
You can refer the below link for clearing floats
Clearing floats
5
solved DIV/CSS Layout Instead of Tables [closed]