Ik heb onderstaande code voor mijn website. Nu is alleen het probleem dat in FireFox de route_top in zijn geheel verdwijnt onder het menu. Hij moet dus eigenlijk lager komen. Hoe kan dit en wat kan ik eraan doen ?:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
html, body {
height:100%;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #000000;
background: url(img/body/bg_body3.gif) center top repeat-y;
margin-top: 0px;
margin: 0;
padding: 0;
}
a:link {
color: #000000;
}
a:visited {
color: #000000;
}
a:hover {
color: #000000;
}
a:active {
color: #000000;
}
.container {
margin: auto;
width: 750px;
min-height: 97.3%;
height:auto;
}
/* for Internet Explorer */
/*\*/
* html .container {
height: 97.4%;
}
/**/
.float1 {
background-image:url(img/body/header.jpg);
text-align: center;
width: 750px;
margin: 0px;
padding: 0px;
float: left;
height:150px;
}
.float2 {
background-image:url(img/menu/menu_back.gif);
text-align: center;
width: 750px;
margin: 0px;
padding: 0px;
float: left;
height:25px;
}
.float3 {
text-align: center;
width: 750px;
margin: 0px;
padding: 0px;
}
.container_news {
margin: auto;
width: 475px;
}
.top_news {
background-image:url(img/news/top.gif);
text-align: center;
width: 475px;
margin: 0px;
padding: 0px;
height:35px;
}
.content_news {
background-image:url(img/news/content.gif);
text-align: center;
width: 475px;
margin: 0px;
padding: 0px;
}
.bottom_news {
background-image:url(img/news/bottom.gif);
text-align: center;
width: 475px;
margin: 0px;
padding: 0px;
height:25px;
}
.container_route {
margin: auto;
width: 625px;
}
.top_route {
background-image:url(img/occasions/top.gif);
text-align: center;
width: 625px;
margin: 0px;
padding: 0px;
height:35px;
}
.content_route {
background-image:url(img/occasions/content.gif);
text-align: center;
width: 625px;
margin: 0px;
padding: 0px;
}
.bottom_route {
background-image:url(img/occasions/bottom.gif);
text-align: center;
width: 625px;
margin: 0px;
padding: 0px;
height:30px;
}
.footer {
background-image:url(img/body/footer.jpg);
text-align: center;
width: 750px;
margin: auto;
}
-->
</style></head>
<body>
<div class="container">
<div class="float1">
<!-- HEADER -->
</div>
<div class="float2">
<a href="?p=nieuws">
<img src="img/menu/nieuws.gif" alt="nieuws" width="100" height="25" border="0" />
</a>
<a href="?p=bedrijf">
<img src="img/menu/bedrijf.gif" alt="bedrijf" width="100" height="25" border="0" />
</a>
<a href="?p=occasions">
<img src="img/menu/occasions.gif" alt="occasions" width="100" height="25" border="0" />
</a>
<a href="?p=route">
<img src="img/menu/route.gif" alt="route" width="100" height="25" border="0" />
</a>
<a href="?p=contact">
<img src="img/menu/contact.gif" alt="contact" width="100" height="25" border="0" />
</a>
</div>
<div class="clear"><!-- CLEAR --></div>
<br />
<div class="float3">
<div class="container_route">
<div class="top_route"></div>
<div class="content_route">
hier de content
</div>
<div class="bottom_route"></div>
</div>
<br />
</div>
</div>
<div class="footer"></div>
</body>
</html>
952 views
