Menue / LIste, statt untereinander nebeneinander
Verfasst: 13.04.2009, 18:02
Ich schaffs einfach nicht die Links nebeneinander zu setzten.
Im Mozilla sieht man gar nichts mehr, im IE ist die Liste noch da, aber nur der Hintergrund hat sich verbreitert.
Ich weiss nich was da verkehrt sein soll.
Die Seite hat noch keine Domain, so hab ich beides gezippt und hier eingehängt, wo mans entpackt sollte egal sein.
ENDE CSS
Im Mozilla sieht man gar nichts mehr, im IE ist die Liste noch da, aber nur der Hintergrund hat sich verbreitert.
Ich weiss nich was da verkehrt sein soll.
Die Seite hat noch keine Domain, so hab ich beides gezippt und hier eingehängt, wo mans entpackt sollte egal sein.
Code: Alles auswählen
body
{
position:absolute;
}
html, body
{
top:0; left:0; right:0;
min-height:100%;
background:#0000DD;
margin:0;
padding:0;
width:100%;
}
#headerCont
{
position:fixed;
top:0; left:0; right:0;
text-align:center;
margin:0;
height:3em;
z-index:3;
}
#header
{
position:absolute;
top:0; left:0; right:0; bottom:0;
height:100%;
background:#0000DD;
z-index:3;
margin:0;
padding:0.2em;
FONT-FAMILY: Arial, Tahoma, 'Sans-serif'
font-size:1.5em;
color: #44565C;
}
a.menu{ display:block
top:1.5em;
left:1.6em;
height:1.6em;
width:52em;
text-decoration: none;
background-color:#ffffff;
z-index:3 }
a.menu:link { color:#00f; background-color:ffffff; }
a.menu:visited { color:#00f; background-color:ffffff; }
a.menu:hover { color:#ff0; background-color:#00f; }
a.menu:active { color:#ff0; background-color:#a03; }
#content
{
margin:0;
padding-top:4.85em;
padding-left:3.0em;
padding-bottom:9em;
width:45em;
z-index:2;
color: #0000DD;
}
#footerCont
{
position:fixed;
bottom:0; left:0; right:0;
text-align:center;
margin:0;
height:3em;
z-index:3;
}
#footer
{
position:absolute;
top:0; left:0; right:0; bottom:0;
height:100%;
background:#0000DD;
FONT-FAMILY: Arial, Tahoma, 'Sans-serif'
font-size:0.8em;
color:#000000;
z-index:3;
}
/* Nun für den MSIE */
* html, * html body
{
overflow:hidden;
bottom:0;
height:100%;
}
* html #header_container, * html #footer_container
{
position:absolute;
width:100%;
padding-right:16px;
}
* html #menu
{
position:absolute;
}
* html #header,* html #footer
{
height:100%;
position:static;
}
* html #content
{
position:absolute;
top:0; bottom:0; left:0; right:0;
height:100%;
width:100%;
overflow:auto;
margin:0;
}
ENDE CSS
Code: Alles auswählen
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>TestListe</title>
<link rel="stylesheet" type="text/css" href="CSSFormate.css">
</head>
<body>
<div id="headerCont">
<h1 id="header">OBEN</h1>
</div>
<div class="menu">
<a class="menu" href="index.htm">Home</a>
<a class="menu" href="extras/index.htm">Extras</a>
<a class="menu" href="links/index.htm">Links</a>
<a class="menu" href="mailto:name@domain.de">E-Mail</a>
</div>
<div id="content">
<table border="0" width="830" height="75" cellspacing="0" cellpadding="0">
<colgroup>
<col width="220">
<col width="610">
<col width="10">
</colgroup>
<tr>
<td bgcolor="#00D500"></td>
<td bgcolor="#00D500">MITTE</td>
<td bgcolor="#00D500"></td>
</tr>
</table>
</div>
<div id="footerCont">
<div id="footer">
<br><b>UNTEN</b>
</div>
</div>
</body>
</html>