Probleme mit Layout (div statt frames) - (CSS-Anfänger)

[bjacke]

Hallo Leute,

ich möchte unsere Projektseite von frames auf div umstellen, habe aber nur wenig Erfahrung mit CSS. Der Aufbau der Seite sollte so bestehen bleiben, wie er zur Zeit ist. Mein Problem ist, dass jeder Browser sein Ding macht (IE u. FF klappen teilweise).

Vielleicht leigt es auch einfach am Stylesheet  :? .

  
/* Farbe, etc. für Links */  
  
  
  #footer a:link, #content a:link, #li_layer a:link,  
  #footer a:visited, #content a:visited, #li_layer a:visited  
  {  
  text-decoration:none;  
  color:#999900;  
  }  
  
  #footer a:hover, #content a:hover, #li_layer a:hover  
  {  
  text-decoration:underline;  
  color:#999900;  
  }  
  
  
  
  /* jetzt geht es los mit dem Layout */  
  
  body  
  {  
   position:absolute;  
   border:0;top:0; left:0; right:0;  
   background:#CCCCCC;  
  
  background-attachment: fixed;  
  background-image: url(images/warr.jpg);  
  background-repeat: no-repeat;  
  background-position: right center;  
  }  
  
  html, body  
  {  
   top:0; left:0; right:0;  
   min-height:100%;  
   margin:0;  
   padding:0;  
   width:100%;  
  
  }  
  
  
  
  #li_layer  
  {  
   position:fixed;  
   top:0;  
   left:0;  
   border:0;  
   width:200;  
   height:100%;  
   background:black;  
  
  }  
  #content  
  { position:absolute;  
   padding-top:20px;  
   padding-left:220px;  
   padding-right:20px;  
   padding-bottom:70px;  
   margin:0;  
  
  
  }  
  
  
  #footer_container  
  {  
   position:fixed;  
   bottom:0; left:200; right:0;  
   margin:0;  
   height:50;  
  }  
  
  #footer  
  {  
   position:absolute;  
   top:0; left:0; right:0; bottom:0;  
  
  }  
  
  
  /* für den MSIE */  
  
  
  * html, * html body  
  {  
   overflow:hidden;  
                        top:0;  
   height:100%;  
  }  
  
  
  * html #content  
  {position:absolute;  
  
   overflow:auto;  
  
  }  
  
  * html #li_layer  
  {  
   position:absolute;  
   top:-1;  
  }  
  
  * html #footer_container  
  {  
   position:absolute;  
  
  }  
  
  
  * html #footer  
  {  
   position:static;  
  }  
  
  * html #content  
  
  {  
   height:100%;  
   width:100%;  
  }  

Auf www.warr.de/news.htm (oder falls der Namensserver sich endlich geändert hat die neue php Version www.warr.de/news.php)
Es sollte also einen Layer auf der linken Seite geben und einen footer.
Und alsob das nicht genug wäre, sollte das auch noch in jedem Browser gleich aussehen.

Falls ihr noch andere Vorschläge habt seid bitte bescheid!!
(bei der php version ist ein Gästebuch, Fotoalbum und ein kontakformular integriert [alles selbst in php gemacht ;), mit eurer Hilfe! ])
Thx Basti

Probleme:
FF keine
IE v6 Scrollbar zu "lang" versteckt sich also unter dem footer)
Opera (zeigt den footer gar nicht erst, das Bild im linken layer rutscht nach oben, macht es aber jetzt schon)

mit mehr browsern habe ich das noch nicht auf dem localhost noch nicht getestet.
 :(

[frankx]

hallo basti,

vielleicht magst du das problem etwas pointierter auf den punkt bringen?

gruß, frankx

[bjacke]

hallo basti,

vielleicht magst du das problem etwas pointierter auf den punkt bringen?

gruß, frankx

Also ich habe mein problem nochmal anders aufgezogen:
Ich möchte 2 Hauptdivs haben, wobei der untere ein feststehnder Footer sein soll. Der Obere div sollte vom unteren rand 50 entfernt sein. Für Opera und FF klappt das schon, aber der IE möchte nicht so recht.
[code]
  #up
  { position:absolute;
   bottom:50;
   left:0;
   right:0;
   margin:0;
   top:0;
   width:100%
  }

#down
  {
   position:fixed;
   bottom:50;
   left:0;
   right:0;
   margin:0;
   width:100%;
  }

/* für den MSIE */

* html #up
  {
   position:absolute;
   top:0;
   bootom:50;
   left:0;
   reight:0;
   width:100%;
   height:100%;

}

* html #down
  {
   position:static;
   bottom:50;
   width:100%;

}
[code]
basti

[wahsaga]

hi,

Ich möchte 2 Hauptdivs haben, wobei der untere ein feststehnder Footer sein soll. Der Obere div sollte vom unteren rand 50 entfernt sein. Für Opera und FF klappt das schon, aber der IE möchte nicht so recht.

#up
  { position:absolute;
   bottom:50;
   left:0;
   right:0;
   margin:0;
   top:0;
   width:100%
  }

  
Der IE beherrscht es nicht, die Maße eines Elementes aus zwei gegenüberliegenden "Koordinaten" absoluter Positionierung herzuleiten (top - bottom, left - right).  
  
Da musst du dir wohl eine andere Möglichkeit überlegen.  
<http://aktuell.de.selfhtml.org/tippstricks/css/footer/> könnte ggf. eine Alternative sein.  
  
gruß,  
wahsaga  
  

-- 
/voodoo.css:  
#GeorgeWBush { position:absolute; bottom:-6ft; }

[erik]

Layer gibt es nicht.