Hmmm. Nu hab' ich die Seite 'mal testhalber "zu Fuß" angelegt. Jetzt steht meine Navi aber links, was sie nicht soll. Ich kann von hier aus (Betrieb) die Daten nicht auf einen Server stellen, daher hier als Listing im Anhang. Was mache ich falsch? (Ich hoffe, da steigt jemand durch...)
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>Rollover per CSS</title>
<link href="CSS/Rollovers_per_CSS.css" rel="stylesheet" type="text/css" media="all">
<style type="text/css" media="screen"></style>
</head>
<body>
<div id="content">
<div id="header">
</div>
<div id="menu">
<a class="menu" id="home" href="Home.html"></a>
<a class="menu" id="news" href="News.html"></a>
<a class="menu" id="pics" href="Pics.html"></a>
<img src="images/SideButtonContact#323232Down.jpg"><br/>
</div>
<img src="images/MainFondBottom.jpg" id= "footer">
</div>
</body>
</html>
CSS:
body { color: #323232; font-size: 62.5%; font-family: Verdana, Arial, Helvetica, sans-serif; background-image: url("../images/WebBG.jpg"); text-align: center; margin: 0; padding: 0 }
#content { background-image: url("../images/MainFondMain.jpg"); background-repeat: repeat-y; background-attachment: scroll; background-position: 0 0; text-align: left; width: 740px; voice-family: inherit }
#header { background-image: url("../images/MainFondTop.jpg"); background-repeat: no-repeat; text-align: left; margin-left: -1px; top: -2em; left: -2em; width: 740px; height: 40px }
a.menu { text-decoration: none; display: block; position: relative; right: 0 }
#menu { display: block; right: 0; width: 110px }
#mainText { padding-right: 10em; padding-left: 3em; position: relative }
#footer { background-image: url("../images/MainFondBottom.jpg"); background-repeat: no-repeat; margin-bottom: -10px; margin-left: -1px }
#home:link { background-image: url("../images/SideButtonHomeUp.jpg"); width: 110px; height: 40px; background-repeat: no-repeat}
#home:visited { background-image: url("../images/SideButtonHomeUp.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#home:hover { background-image: url("../images/SideButtonHomeOver.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#home:active { background-image: url("../images/SideButtonHomeDown.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#pics:link { background-image: url("../images/SideButtonPicsUp.jpg"); background-repeat: no-repeat; width: 110px; height: 40px }
#pics:visited { background-image: url("../images/SideButtonPicsUp.jpg"); background-repeat: no-repeat; width: 110px; height: 40px }
#pics:hover { background-image: url("../images/SideButtonPicsOver.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#pics:active { background-image: url("../images/SideButtonPicsDown.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#news:link { background-image: url("../images/SideButtonNewsUp.jpg"); background-repeat: no-repeat; width: 110px; height: 40px }
#news:visited { background-image: url("../images/SideButtonNewsUp.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#news:hover { background-image: url("../images/SideButtonNewsOver.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#news:active { background-image: url("../images/SideButtonNewsDown.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#contact:link { background-image: url("../images/SideButtonContactUp.jpg"); width: 110px; height: 40px; background-repeat: no-repeat}
#contact:visited { background-image: url("../images/SideButtonContactUp.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#contact:hover { background-image: url("../images/SideButtonContactOver.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }
#contact:active { background-image: url("../images/SideButtonContactDown.jpg"); width: 110px; height: 40px; background-repeat: no-repeat }