Schnuckenpapa
New member
Guten Abend allerseits!
Ich habe folgende Frage:
Was muss ich tun damit die Navigation in der dargestellten Anordnung im gelben div (id=butt) erscheint? Bei position:relative werden sie zwar nebeneinander gesetzt, aber jeder Button in einer neuen Zeile und die div-Höhe wird augedehnt. Mit magin-top:- ...px wandert zwar der Button nach oben, aber die div-Höhe bleibt gedehnt.
Es sollte im IE6..+, Firefox,Opera funktionieren.
Ich bitte um Hilfe bzw. Rat
Grüsse vom Schnuckenpapa
ps: Diese Farben sind nur für die Anfrage eingesetzt, normalerweise sieht das anders aus (Bildhintergrund, Verlauf usw.)!
Ich habe folgende Frage:
Was muss ich tun damit die Navigation in der dargestellten Anordnung im gelben div (id=butt) erscheint? Bei position:relative werden sie zwar nebeneinander gesetzt, aber jeder Button in einer neuen Zeile und die div-Höhe wird augedehnt. Mit magin-top:- ...px wandert zwar der Button nach oben, aber die div-Höhe bleibt gedehnt.
Es sollte im IE6..+, Firefox,Opera funktionieren.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Forumfrage</title>
<style type="text/css">
a.navi:link,a.navi:visited,a.navi:active
{display:block;
font-size:16px;
font-weight:normal;
font-style:italic;
color:#FFFFFF;
position: absolute;
height:28px;
width:110px;
line-height:28px;
text-decoration:none;
vertical-align:middle;
text-align:center;
background-color:#000099}
a.navi:hover
{text-decoration:underline;
color:#FFFF00;
background-color:#990099}
</style>
</head>
<body style="margin:0px;background-color:gray;">
<div id="inhalt" style="width:900px; height:800px; margin:auto; background-color:#00FFFF; border:1px solid yellow;">
<div id="in1" style="width:710px; height:81px; margin:auto; text-align:center; border:1px solid red;"></div>
<div id="butt" style=" width:710px; height:72px; margin:auto; background-color:#FFFF99; border:1px solid black;">
<a href="" class="navi" style="left:2px; top:3px; text-decoration:underline; color: #FFFF00;" onclick="alert('Zur Startseite')">Home</a>
<a href="" class="navi" style="left:121px; top:3px;" onclick="alert('News und aktuelle Events')">Aktuelles</a>
<a href="" class="navi" style="left:240px; top:3px;" onclick="alert('Beschreibung der Angebote mit Bildern')">Unser Angebot</a>
<a href="" class="navi" style="left:359px; top:3px;" onclick="alert('Angebot für gesellschaftliche Ereignisse')">Gesellschaften</a>
<a href="" class="navi" style="left:478px; top:3px;" onclick="alert('Grillgelegenheit im Freien')">Grillen & mehr</a>
<a href="" class="navi" style="left:597px; top:3px;" onclick="alert('Ferrari, Fussball, Gesang usw.')">Sport-Fans</a><br>
<a href="" class="navi" style="left:2px; top:40px;" onclick="alert('Zur Startseite')">Sonnenschein</a>
<a href="" class="navi" style="left:121px; top:40px;" onclick="alert('Die gemütliche Ecke')">Stübchen</a>
<a href="" class="navi" style="left:240px; top:40px;" onclick="alert('Wenns was grösseres wird')">Der Saal</a>
<a href="" class="navi" style="left:359px; top:40px;" onclick="alert('Viele Bilder von Dekorationen, Ereignissen usw.')">Bilderschau</a>
<a href="" class="navi" style="left:478px; top:40px;" onclick="alert('Wir sorgen uns um Sie')">Unsere Truppe</a>
<a href="" class="navi" style="left:597px; top:40px;" onclick="alert('Um dem Gesetz Genüge zu tun')">Impressum</a>
</div>
<div id="in2" style="width:690px;height:438px;margin:10px auto; border:10px double #663300;"></div>
</div>
</body>
</html>
Ich bitte um Hilfe bzw. Rat
Grüsse vom Schnuckenpapa
ps: Diese Farben sind nur für die Anfrage eingesetzt, normalerweise sieht das anders aus (Bildhintergrund, Verlauf usw.)!