Hi,
i have my site looking like this :
html>
<head>
<title>Toller Titel</title>
<link rel="stylesheet" type="text/css" href="layout.css"/>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1" />
<script language="JavaScript">
<!--
button1= new Image();
button1.src = "bilder/menue/menue1.jpg"
button2= new Image();
button2.src = "bilder/menue/menue2.jpg"
button3= new Image();
button3.src = "bilder/menue/menue3.jpg"
//-->
</script>
<div id="menue">
<div style="text-align: center;">
<a href="bla.html" onmouseover="button1.src='bilder/menue/menue1.jpg';" onmouseout="button1.src='bilder/menue/menue1_in.jpg';"> <img src="bilder/menue/menue1_in.jpg" style="border: 0px solid ; width: 96px; height: 58px;" alt="" name="button1" border="0"><br>Erstens!!<br></a>
<a href="foo.html" onmouseover="button2.src='bilder/menue/menue2_in.jpg';" onmouseout="button2.src='bilder/menue/menue2.jpg';"> <img src="bilder/menue/menue2.jpg" style="border: 0px solid ; width: 96px; height: 58px;" alt="" name="button2" border="0"><br>FOO<br></a>
<a href="bar.html" onmouseover="button3.src='bilder/menue/menue3in.jpg';" onmouseout="button3.src='bilder/menue/menue3jpg';"> <img src="bilder/menue/menue3jpg" style="border: 0px solid ; width: 96px; height: 58px;" alt="" name="button3" border="0"><br>BAAAAAAR<br></a>
</div>
</div>
<style type="text/css">
body { background-repeat: no-repeat; background-attachment: fixed; background-image: url('bilder/hintergrund.gif'); background-position: center }
</style>
<div style="text-align: center;">
<div id="inhalt">
<div id="topkurz">
<h3>Herzlich Willkommen!</h3>
</div>
<div id="topquer">
<h1>Anfang und so weiter</h1>
</div>
</div>
<h3>Hallo und Willkommen zum Xten Mal!!</h3>
<h1>Mehr Text!!!1</h1>
<p>informativer Text informativer Text informativer Text </p>
</div>
</div>
</div>with layout.css like this :
#menue {width: 96px; float: left;}
#hintergrund {float:center;}
#topquer{
background-color:#bf040d;
color: #FFFFFF;
padding:0;
margin:0;
height:80px;}
#inhalt{
width:700px;
border-top:0px solid #E4E4E4;
margin:0px;
margin-left:auto;
margin-right:auto;
padding:0px;}
#topkurz{
background-color:#000000;
color:#9B9B9B;
padding:0px;
margin:0px;
height:20px;}
When i open the page in Firefox everything is allright except that when i resize the browserwindow at some point the 2 div sections hit the menu on the left. this would be no problem if there were just pictures, but because i have labeled the pictures the text-links get a red backgroundcolor.
My second problem is that IE begins drawing the sections under the menu for some sick reason when i resize the window. i would really like to know how i can avoid those events without forcing my website to load in a prescaled (unresizeable) window.
sorry for my bad english & thanks in advance!
