tomx: css Navi mit HG Bildern

Beitrag lesen

Hallo Zusammen

sitze gerade an ner neuen Homepage und bin schier am verzweifeln!
bin noch nicht so css sattelfest und Quäle mich gerade mit einer navi in einem Kontainer div rumm.

Bitte helfen!!!

also zu meinem Problem:
Ich bastel an einer HP mit fixer Grösse (90x560px). Nun habe ich dazu ein Div (Kontainer mit Hintergrundbild) eingemittet. Nun soll in dieses eingemittete Div meine Navi. Habe es mit Positionierung static, absolut, und relative versucht, und habs einfach nicht hinbekommen. Auch "sprengt es mir im Firefox die Navi auf (Abstände zwischen den Navikästchen)??

Weis wirklich nicht mehr weiter :(

hier mein Code:

<head>
<style type="text/css">

body{ text-align:center; // Für den IE
  :}

#kontainer{
  text-align:left;
  width:900px;
  height: 560px;
  padding-top:  0px;
  margin:5% auto;
  background: url("Bilder/HG's/DJ_Sbace_HG_Bild_(900x560).jpg");
  z-index:1;
  }

#navi {
  position:absolute; top:100px; left:55px;
  padding-left:0px;
  z-index:2;
  }

#menu a {
  display:block;
  width:77px;
  height: 21px;
  font: bold 12px/1Arial;
  padding: 0.4em;
  color:white;
  background: url("Bilder/Buttons/DJ_Sbace_Button_01.jpg") 0 0 no-repeat;
  text-decoration: none;
  float: left;
  }
 #menu a:hover {
  background: url("Bilder/Buttons/DJ_Sbace_Button_02.jpg") 0 0 no-repeat;
  color: white;
  }
 #menu a:active {
  background: url("Bilder/Buttons/DJ_Sbace_Buttond_03.jpg") 0 0 no-repeat;
  color:white;
  }

</style>

</head>

<body style="background-color: #000; margin:0; padding:0;">

<div id="kontainer" style="width:900px; height:560px;">

<div id="navi">
 <div id="menu">
  <a href="home.html">Home</a>
  <a href="hystory.html">Hystory</a>
  <a href="booking.html">Booking</a>
  <a href="gigs.html">Gigs</a>
  <a href="releases.html">Releases</a>
  <a href="pictures.html">Pictures</a>
  <a href="guestbook.html">Guestbook</a>
  <a href="links.html">Links</a>
 </div>
</div>

</div>

</body>

Grüsse Tomx