Hallo, habe folgendes Problem:
Also meine Seite soll so aussehen:
| head | head2 |
|nav_bg | head3 |
| head4 |
das ganze ist in dem div-tag header eingebunden, der das ganze um xx px nach rechts verschiebt.
CSS:
<style type="text/css">
div.header {margin-top:0px; margin-left:20px; width:800px;}
div.head {margin-top:0px; margin-left:0px; float:left;}
div.nav_bg {margin-top:0px; margin-left:0px; background-image:url(img/head/nav_bg.jpg); background-repeat:no-repeat; padding:0px; width:650px; height:23px; float:left; }
div.head3 {margin-top:0px; margin-left:0px; clear:both;}
div.head4 {margin-top:0px; margin-left:0px; float:left}
</style>
Code mit den div-tags:
<div class="header">
<div class="head"><img src="img/head/head1.jpg" width="650" height="117"></div>
<div class="head"><img src="img/head/head2.jpg" width="150" height="117"></div>
<div class="nav_bg">
<table width="650" height="21" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="53"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('news','','img/buttons/newso.gif',1)"><img src="img/buttons/news.gif" name="news" width="53" height="23" border="0"></a></td>
<td width="57"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('about','','img/buttons/abouto.gif',1)"><img src="img/buttons/about.gif" name="about" width="57" height="23" border="0"></a></td>
<td width="54"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('dates','','img/buttons/dateso.gif',1)"><img src="img/buttons/dates.gif" name="dates" width="54" height="23" border="0"></a></td>
<td width="68"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('gallery','','img/buttons/galleryo.gif',1)"><img src="img/buttons/gallery.gif" name="gallery" width="68" height="23" border="0"></a></td>
<td width="94"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('ref','','img/buttons/refo.gif',1)"><img src="img/buttons/ref.gif" name="ref" width="94" height="23" border="0"></a></td>
<td width="65"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('charts','','img/buttons/chartso.gif',1)"><img src="img/buttons/charts.gif" name="charts" width="65" height="23" border="0"></a></td>
<td width="54"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('links','','img/buttons/linkso.gif',1)"><img src="img/buttons/links.gif" name="links" width="54" height="23" border="0"></a></td>
<td width="100%"> </td>
</tr>
</table>
</div>
<div class="head3"><img src="img/head/head3.jpg" width="150" height="21"></div>
<div class="head4"><img src="img/head/head4.jpg" width="150" height="23"></div>
</div>
nun aber folgendes problem, der head3 ist um 1-2px weiter entfernt vom nav_bg, obwohl margin-left:0px ist. dadurch entsteht eine unschöne spalte und die grafiken passen nicht mehr. Der head4 wiederum passt genau. kann mir da jemand helfen?
