zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden 100% höhe des Designs. Footer immer unten.

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 25.01.2008, 21:25
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.01.2008
Beiträge: 4
Donar befindet sich auf einem aufstrebenden Ast
Standard 100% höhe des Designs. Footer immer unten.

n'abend @ all,

Ich bin noch ein absoluter Neuling wenn es ums aufbauen einer Webseite mittels CSS und DIV-Containern geht. Ich habe bisher immer alles mit Tabellen aufgebaut und will mich jetzt mal endlich umgewöhnen ... besser ist das

Ich habe ein recht einfaches Layout geplant, dachte ich jedenfalls. Jetzt habe ich nur leider 2 Probleme, die ich einfach nicht lösen kann.

Ich hab schon ein wenig gegooglet aber ein solcher Fall war komischerweise nicht nochmal zu finden.

Hier mal eine Ansicht, wie es zur Zeit aussieht (Im moment nur notdürftig mit Farben gefüllt):
http://foo.board23.de/

Und nochmal zum Download:
http://foo.board23.de/test.rar

Meine Probleme sind jetzt folgende ...

Ich habe den Div-Container, der um die komplette Seite liegt mal Grau eingefärbt, damit man ihn sieht. Dieser Container hat eindeutig eine Höhe von 100%, so wie ich es haben möchte.
Allerdings möchte ich den Footer immer am ende der Seite haben und der dazwischen liegende Content-Bereich soll halt so hoch sein, wie es eben möglich ist.

Das wäre Problem 1 - kommen wir zu Problem 2 ...

Die beiden Container #leftnavi und #rightnavi lasse ich links und rechts floaten. Ich denke hierbei erkennt man ganz gut wie hässlich es im Moment aussieht ... wenn der Content länger ist als die Inhalte der beiden Navigationsleisten, dann laufen die Navigationsleisten halt nicht bis zu Ende weiter und das ist das, was ich beheben möchte.


Kurz gesagt soll der Footer immer ganz am Ende der Seite platziert sein und alles was zwischen #topnavi und #footer liegt soll die Maximale höhe erhalten. Wenn ich den Mainbereich auf 100% stelle, dann geht er viel zu weit nach unten, weil er dann genauso hoch ist wie die Seite, was aber nicht so gut kommt, da durch #header und #topnavi ja schon 150px verbraucht werden.

wäre nett, wenn mir jemand helfen könnte ... wie gesagt, bin recht neu auf dem Bereich (bzw. es ist das erste was ich überhaupt so zusammen gebastelt habe)

MfG
Donar
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 25.01.2008, 21:53
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

FAQ (oberster Thread) Punkt 7.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 25.01.2008, 22:18
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.01.2008
Beiträge: 4
Donar befindet sich auf einem aufstrebenden Ast
Standard

OK, sorry ... so hatte ich es schonmal versucht aber klappte nicht ...
nachdem ich nen bisschen anderes Zeug umgebaut hatte gings dann aber

wäre noch das 2te Problem. Der Inhalt und die rechte und linke Navigationsleiste müssen jetzt auch bis zum Ende laufen ... funktioniert das überhaupt mit dem floating oder muss ich mir da was anderes einfallen lassen?

MfG
Donar
Mit Zitat antworten
  #4 (permalink)  
Alt 25.01.2008, 22:34
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

FAQ Punkt 1.
Mit Zitat antworten
  #5 (permalink)  
Alt 25.01.2008, 23:02
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.01.2008
Beiträge: 4
Donar befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von heiko_rs Beitrag anzeigen
FAQ Punkt 1.
Auch nicht gerade die schönste Lösung würde ich mal behaupten. Das hatte ich mir eben schon angesehen aber es muss doch wohl ne andere Möglichkeit geben.

Es wird doch irgendwie möglich sein einem Div zu sagen, dass es sich so weit nach unten ausdehnen soll, bis es an den Rand des Eltern-Divs stößt. Ich finde es ein bisschen schwachsinnig solche Effekte mit einem wiederholenden Hintergrundbild zu simulieren ...

ich mein, die Lösung mit dem Footer ist auch unschön, weil ich ihn dadurch nicht mehr in dem Div habe, welches eigentlich alles umschließen soll. CSS ist doch eigentlich mehr als billige Tricks anzuwenden ... ich möchte halt Struktur haben und die werde ich so sicher nicht erhalten.

Geändert von Donar (25.01.2008 um 23:04 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 26.01.2008, 00:18
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von Donar Beitrag anzeigen
Es wird doch irgendwie möglich sein einem Div zu sagen, dass es sich so weit nach unten ausdehnen soll, bis es an den Rand des Eltern-Divs stößt.
display: table/table-cell, aber das unterstützt der IE leider nicht.

Zitat:
Zitat von Donar Beitrag anzeigen
Ich finde es ein bisschen schwachsinnig solche Effekte mit einem wiederholenden Hintergrundbild zu simulieren
Bedanke Dich bei Microsoft.

Zitat:
Zitat von Donar Beitrag anzeigen
die Lösung mit dem Footer ist auch unschön, weil ich ihn dadurch nicht mehr in dem Div habe, welches eigentlich alles umschließen soll.
Du kannst ein div mit height: 100%; um alles legen und darin mit min-height: 100%; arbeiten.

Zitat:
Zitat von Donar Beitrag anzeigen
CSS ist doch eigentlich mehr als billige Tricks anzuwenden
Das hat mit CSS nicht viel zu tun, sondern mit den zur Verfügung stehenden HTML-Elementen. Tabellen bestehen nunmal aus mehreren Elementen, die alle miteinander "kommunizieren", divs dagegen sind per se "alleinstehend" und unabhängig.

Dennoch, mit display: table; etc. bekommt man auch divs zu exaktem Tabellen-Verhalten, aber dank MS klappt das leider immer noch nicht im IE (erst in Version 8 ).
Mit Zitat antworten
  #7 (permalink)  
Alt 26.01.2008, 00:41
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.01.2008
Beiträge: 4
Donar befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von heiko_rs Beitrag anzeigen
Dennoch, mit display: table; etc. bekommt man auch divs zu exaktem Tabellen-Verhalten, aber dank MS klappt das leider immer noch nicht im IE (erst in Version 8 ).
Ja, der IE ist immer das Problem ... ich hatte es ja eigentlich schon fertig und dann öffnet man es im IE und nichts geht mehr ...

am besten frage ich einfach den Browser ab und verweigere IE Usern den zutritt ...
Mit Zitat antworten
  #8 (permalink)  
Alt 26.01.2008, 02:02
EvT EvT ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.09.2006
Ort: Bad Wildungen
Beiträge: 2.220
EvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekannt
Standard

Zitat:
Zitat von Donar Beitrag anzeigen
ich mein, die Lösung mit dem Footer ist auch unschön, weil ich ihn dadurch nicht mehr in dem Div habe, welches eigentlich alles umschließen soll. CSS ist doch eigentlich mehr als billige Tricks anzuwenden ... ich möchte halt Struktur haben und die werde ich so sicher nicht erhalten.
"Geht's uns nicht so mit allen Dingen, denen wir gründlich zu Leibe rücken,
daß sie grad dann, wenn wir sie mit dem zärtlichsten Scharfsinn erfassen möchten,
sich heimtückisch zurückziehen in den Schlupfwinkel der Unbegreiflichkeit?"

["Eduards Traum", Wilhelm Busch]
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
div auf 100% Höhe des Browsers siliciumcarbid CSS 2 20.03.2011 13:00
Kompatibilität des Designs für den IE MuschelInBlau CSS 10 05.05.2009 22:24
Höhe des DIVs automatisch auf volle Höhe scheichxodox Knowledge Base 5 21.12.2004 11:31
100% Höhe des Bodys do CSS 7 25.11.2004 22:53
3 div-Container sollen autom. die Höhe des längsten haben DanEl CSS 4 13.06.2004 22:39


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:11 Uhr.