zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Faux Columns - keine Lösung?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 19.09.2007, 18:11
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.02.2005
Ort: Bremen
Beiträge: 86
D3mOn befindet sich auf einem aufstrebenden Ast
Standard Faux Columns - keine Lösung?

Es ist mir bekannt, dass es nicht möglich ist ein Tochter-Element mit min-height:100% auszustatten wenn das Parent height: auto hat.

Mein Layout:
Wrapper (min-height:100%;height:auto), beinhaltet Header, darunter horizontale Navi, darunter der Content.

Wie erschaffe ich also ein Content bereich der bis ans Ende der Seite eine sich wiederholende Grafik anzeigt?
Nach dem selben Prinzip der Faux Columns, auch wenn es hier keine Spalten gibt.
Der Wrapper hat die Hintergrundgrafik.


Nun zu meinem Problem: Der Content soll eine Hintergrundgrafik besitzen, die sich in x-Richtung wiederholt (Verlauf von oben nach unten).
Zusätzlich, soll am Rand des Wrappers, eine Grafik in y-Richtung laufen z.b. ein dicker grafischer Border.
Das Ganze soll sich bis zum unteren Rand des Fenster wiederholen.

Wie löse ich das Problem? Setze ich um den Wrapper umzu noch ein div mit der repeat-y Grafik, wird der Wrapper nicht mehr auf 100% laufen.

Ich wüsste zwar wie man das mit Tabellen löst, aber die Teile hab ich schon ewig nicht mehr benutzt, und auch dafür kennt hier sicher jemand ne Lösung

Grüße,
Marcel
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 19.09.2007, 18:14
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.02.2005
Ort: Bremen
Beiträge: 86
D3mOn befindet sich auf einem aufstrebenden Ast
Standard

Ich hab noch eine Idee, man könnte ein riesiges Image verwenden, was beide Backgrounds beinhaltet, aber ist das zumutbar?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 20.09.2007, 16:18
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.02.2005
Ort: Bremen
Beiträge: 86
D3mOn befindet sich auf einem aufstrebenden Ast
Standard

Weiß denn niemand eine Antwort???

Es ist kein Problem für mich wenn ihr mir sagt, dass es keine optimale Lösung gibt ^^
Mit Zitat antworten
  #4 (permalink)  
Alt 20.09.2007, 22:26
Benutzerbild von Lockhead883
<? echo "Hello World"; ?>
XHTMLforum-Mitglied
 
Registriert seit: 01.03.2006
Beiträge: 132
Lockhead883 befindet sich auf einem aufstrebenden Ast
Standard

ich kann dich nicht wirklich verstehen...

Du hast nen Wrapper mit einer Hintergrundgrafik (repeat-y), in dem wrapper untereinander Header, Nav und Content. Content soll jetzt auch noch ne Hintergrundgrafik (repeat-y) bekommen. wo liegt das problem?

????

Fixed oder Liquid Width?

Was soll denn alles min-height haben? soll der content auch bis zum ende gehen, wenn nicht genug inhalt da ist?

Geändert von Lockhead883 (20.09.2007 um 22:30 Uhr)
Mit Zitat antworten
  #5 (permalink)  
Alt 21.09.2007, 15:06
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.02.2005
Ort: Bremen
Beiträge: 86
D3mOn befindet sich auf einem aufstrebenden Ast
Standard

Ich dachte ich hätte das Ganze nicht ganz so schwammig formuliert, naja.

Also der Content soll zumindest zu aussehen, als würde er bis nach unten laufen,
zumindest soll es die Hintergrundgrafik.

Es wäre ja auch kein Problem, wenn beide Hintergründe repeat-y wären, jedoch ist der Hintergrund im Content repeat-x (und auch repeat-y).

Um es dir etwas bildlicher zu gestalten, hier die Seite:
Epic WebMedia - Only the epic solution is the best solution

Der Haupthintergrund ist ein Bild mit den Maßen: 1x768 (repeat-x, und repeat-y).
Jetzt will ich das Design um einen eine grafischen Border erweitern, jenseits des Wrappers. Also am Rand des Wrappers soll eine Grafik entlanglaufen, die ca. 30-50px Breit sein soll, von oben nach unten (repeat-y).
Die soll natürlich auch min-height:100% haben.

Wenn also ein <div id="grafischerborder"> um den wrapper erstelle, kann dieser nicht mehr die 100% höhe von body erben.

Falls es noch zu unverständlich ist, ich kanns auch noch genauer erläutern oder in html darstellen ^^

Beste Grüße, Marcel
Mit Zitat antworten
  #6 (permalink)  
Alt 21.09.2007, 15:14
Benutzerbild von etux
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 17.09.2007
Ort: Berlin
Beiträge: 643
etux wird schon bald berühmt werden
Standard

Hallo D3mOn,

den <div id="grafischerborder"> brauchst Du nicht. Du kannst dafür den <body> - Tag benutzen,

Grüße: Emil

P.S.: Sory, hab gerade gesehen, dass Du in schon benutzest. Unter Umständen geht das aber auch mit dem <html> - Tag.

Geändert von etux (21.09.2007 um 15:18 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 21.09.2007, 15:39
Benutzerbild von Geronimo
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 14.06.2004
Beiträge: 2.644
Geronimo sorgt für eine eindrucksvolle AtmosphäreGeronimo sorgt für eine eindrucksvolle Atmosphäre
Standard

Die Elemente html und body lassen sich in älteren Browser nur sehr begrenzt formatieren.
Mit Zitat antworten
  #8 (permalink)  
Alt 21.09.2007, 18:15
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.02.2005
Ort: Bremen
Beiträge: 86
D3mOn befindet sich auf einem aufstrebenden Ast
Standard

also wenn es im firefox, opera, safari und ab IE 6 geht bin ich zufrieden ^^

- aber wie soll ich ein backgroundimage von body/html so positionieren, dass es sich am wrapper ausrichtet und bei scroll der browserbreite mitbewegt?

mit background-position:50% ??
Mit Zitat antworten
  #9 (permalink)  
Alt 21.09.2007, 18:46
Benutzerbild von etux
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 17.09.2007
Ort: Berlin
Beiträge: 643
etux wird schon bald berühmt werden
Standard

Hallo D3mOn,

ich kann mir immer noch nicht Dein Wunsch-Ergebnis vorstellen. Du könntest es erstmal versuchen und hoch laden. Wenn man die Grafiken sieht, ist es leichter zu verstehen was wohin Du positionieren willst.

Grüße: Emil
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 23.09.2007, 16:52
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.02.2005
Ort: Bremen
Beiträge: 86
D3mOn befindet sich auf einem aufstrebenden Ast
Standard

Also ich hab jetzt mal einen grafischen Border mit y-repeat zum Test gemacht und auf die Seite gepackt.

Hier das Ergebnis:
Epic WebMedia - Only the epic solution is the best solution

Wie ihr sehen könnt, kann der Content keine 100% bei min-height erben.

Wüsste nicht wie man das lösen könnte...

Beste Grüße,
Marcel
Mit Zitat antworten
Sponsored Links
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
4 Spalten Design mit Faux Columns Trick stipo CSS 2 11.07.2009 14:45
dynamische Höhe bei div + Mindesthöhe mit faux columns? marven CSS 4 09.04.2008 21:46
Mitwachsen ohne Faux Columns [oder andere Lösung..] grischa_sgd CSS 3 08.12.2007 20:33
faux columns und height:100% sind keine Lösungen Mambo_mango CSS 18 05.05.2005 19:08


Alle Zeitangaben in WEZ +2. Es ist jetzt 09:37 Uhr.