ichen: Mehrere DIV Boxen ineinander

Beitrag lesen

Hi Eschy!

ich bekomme zwar den textinhalt aber er befindet sich nicht an der stelle wie ich will und in #inside angegeben habe.

Hast du dir schonmal angesehen, wo du laut #inside deinen Text stehen hast? Nämlich von der oberen linken Ecke des Fensters aus 10px nach links und 18px nach unten...

#inside {
position: absolute;
left:10px;
top:18px;
width: 750px;
border: 1px solid;
}

Versuch mal von dem fixierten Layout (position:absolute) weg zu kommen.

#head {
  position: absolute;
  left: 20px;
  top: 20px;
  height: 300px;
  width: 1024px;
  background-image: url(img/header.png);
  background-repeat: no-repeat;
  border: 1xp solid;
}

Hier tun es auch margin-top/left:20px;

ul#navi {
  position:absolute ;
  top: 250px;
  left: 20px;
  width: 982px;
  height:53px;
/*  border: 1px solid; */
  list-style-type:none;
}

Als Blocklevel-Element ordnet es sich eh unter dem Head an. Wenn es zu weit runter rutscht, dann mit margin-top:-Zahlpx; (neg. margin.top) gegensteuern.

#left {
  position: absolute;
  left: 20px;
  top: 320px;
  width: 230px;
  border-right: 1px solid;
/*border: 1px solid;*/
}

Arbeite mit float und width. Auch hier kannst du mittels margin nachkorrigieren.

img#top {
  position:absolute;
  left:250px;
  top:322px;
  width:800px;
  height: 18px;
}

Auch hier: position:absolute; raus. Wenn float für #left vernünftig gesetzt ist, sollte das Bild fast da sein, wo es hin soll, ansonsten mit margin nachbessern. Gleiches gilt für das nachfolgende:

#content {
position:absolute;
left:250px;
top:340px;
width:800px;
background-image: url(img/bg.png);
background-repeat: repeat-y;
/*border: 1px solid;*/
}

Fixierte Layouts sind zwar "handlich" zu bauen, aber unschön. Lass den Browser die grobe Anordnung selbst machen und korrigiere mit margin.

tschau
ichen

--
Halte deine Umwelt sauber!