iiks: css layout

Beitrag lesen

SELF-Forum

css layout

iiks
– Informationen zu den Bewertungsregeln

hallo!

nachdem ich mir die grundlagen angelesen habe und mein problem sich von html auf css verlagert hat, hielt ich es für sinnvoll, einen neuen thread zu öffnen:

hier erstmal ein bild und eine kleine erläuterung, was ich eigentlich machen will:

BILD

die seite hat, wie man sieht ein zusammenhängendes layout.
der banner ist oben mittig zentriert und soll sich nicht bewegen. darunter sitzt der bereich für den inhalt. daneben hab ich eine navileiste, bzw. den hintergrund dazu platziert.
die navileiste soll auch beim zoomen an dieser stelle bleiben, momentan habe ich sie durch einen <div></div> tag per position:absolute  an ihre stelle gesetzt. was allerdings beim zoomen nicht funktioniert...

außerdem soll der inhaltsbereich mit längerem text mitwachsen. was ich bisher auch hinbekommen habe.

momentan ist eigentlich nur das problem: wie ich die navileiste verwirkliche.

hier mal der bisherige code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<title>test</title>  
<style type="text/css">  
   body {  
      background-color:#5f5f5f;  
      text-align: center;  
   }  
  
   div#Seite {  
      text-align: left;  
      margin: 0 auto;  
      width: 594px;  
      padding: 0;  
      background: url(Inhalt.jpg) repeat-y;  
  
   }  
  
   div#Inhalt {  
      margin: 0px 5px 0px 150px;  
      padding: 0;  
  
   }  
  
   div#Inhalt p {  
      margin: 0px 0px 0px 0px;  
      padding: 0;  
  
   }  
  
   div#navi {  
      position:absolute;  
      top: 220px;  
      left: 300px;  
      width: 107px;  
      height: 189px;  
      background: url(Navi.jpg)  
   }  
  
   h1 {  
      width: 594px;  
      height: 204px;  
      margin: 0 auto;  
      padding: 0;  
      text-align: center;  
      background: url(banner.jpg) no-repeat 100% 100%;  
   }  
  
   p#Fusszeile {  
      clear: both;  
      margin: 0;  
      padding: 0;  
      text-align: center;  
      background-image: url(Foot.jpg) no-repeat 100% 100%;  
   }  
  
</style>  
</head>  
  
<body>  
<h1></h1>  
<div id="navi"></div>  
<div id="Seite">  
    <div id="Inhalt">  
    </div>  
</div>  
  
</body>  
</html>

vllt. kann mir der ein oder andere noch sagen wie ich das komplette layout per css besser verwirkliche. mir kommt es nämlich so vor, dass das layout zwar halbwegs funktioniert aber eigentlich totaler mist ist^^

vielen dank schonmal für eure hilfe!!!

mfg

iiks

Beitrag melden
–
Informationen zu den Bewertungsregeln