<html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>template-css.html</title>
<meta name="author" content="kerstin">
<style type="text/css"><!--
*{
margin:0;
padding:0;
}
body
{
background-color: #FFFFFF;
font-family: VERDANA,ARIAL,HELVETICA;
text-align: center;
border: 3px solid yellow;
}
#container
{
background-color: #FFFFFF;
position: absolute:
z-index: 3;
height: 600px;
width: 800px;
border: 2px solid black;
margin: auto;
text-align: left;
}
#header
{
background-color: #FFFFFF;
border: 2px solid blue;
text-align: left;
height: 96px;
margin-bottom: 5px;
}
.headgrafik1
{
margin:0;
float:left;
vertical-align: bottom;
border: 2px solid red;
}
.headgrafik2
{
float: right;
border: 2px solid red;
}
#menutop
{
background-color: #FFFFFF;
width: 795px;
border-bottom: 1px solid black;
}
#menuleft
{
background-color: #E9F1F0;
float: left;
margin: 0;
width: 106px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
#main
{
background-color: #CEE1DD;
float: right;
width: 690px;
margin: 0px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
#main-layer
{
background-color: #CEE1DD;
border: 3px solid green;
position: fixed;
top: 100px;
left: 100px;
width: 640px;
height: 480px;
z-index: 1;
overflow: auto;
margin: 0px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
#footer
{
background-color: #E9F1F0;
text-align: right;
float: right;
clear: right;
height: 20px;
width: 690px;
padding: 0;
margin: 0;
}
#footerinnen
{
background-color: #CEE1DD;
clear: left;
margin: 0;
width: 106px;
height: 20px;
float: left;
}
--></style>
<script language="JavaScript">
function timedDiv()
{
var t=setTimeout("showDiv",4000);
}
function showDiv()
{
document.getElementById("fragediv").style.visibility = 'visible';
}
function hideDiv()
{
document.getElementById("fragediv").style.visibility = 'hidden';
}
</script>
</head>
<body onload="timedDiv()">
<div id="container">
<div id="header" >
<img src="gfx/logo.jpg" class="headgrafik1">
<img src="gfx/composing.gif" class="headgrafik2">
</div>
<div id="menutop">lala</div>
<div id="menuleft">lala</div>
<div id="fragediv"
style="position: absolute; left: 100px; top: 80px; height: 400px visibility: hidden "> <!--dies ist der layer der geöffnet werden soll-->
<table border=0>
<tr><td></td><td align=right>
<a href="javascript:hideDiv()"><img src="gfx/close.JPG"></a>
</td></tr>
<tr><td colspan=2>
<iframe src="http:www.google.de" width="640" height="480" name="test">
</iframe>
</td></tr></table>
</div>
<div id="main">Quod si tam Graecis novitas invisa fuisset quam nobis, quid nunc esset vetus? Aut quid haberet quod legeret tereretque viritim.Ut primum positis nugari Graecia bellis coepit et in vitium fortuna labier aequa, nunc athletarum studiis, nunc arsit equorum, marmoris aut eboris fabros aut aeris amavit, tibicinibus, nunc est gavisa tragoedis; puella.
</div>
<div id="footer">fuss </div>
<div id="footerinnen"></div>
</div>
</body>
</html>