27.01.2008, 12:27
Hi alle miteinander,
ich bin gerade dabei, das Design meines Forums zu überarbeiten, und stehe momentan vor einem Problem, wo ich seit Tagen schon keine Lösung für finde.
Als Veranschaulichung hier eine Bildmontage, wie es am Ende aussehen soll:
[attachment=2821]
Ich habe die einzelnen Bereiche im Bild mit Rahmen abgegrenzt, damit die Aufteilung klarer wird.
Im Ganzen soll es eine Box werden, die ich später dann für viele verschiedenen Zwecke einsetzen werde (Forenanzeige der Startseite, Übersicht, Shoutbox etc.).
Der mittlere Teil wird der eigentliche Content, der soll hier nicht weiter interessieren.
Mein Problem sind die beiden Leisten oben bzw. unten: Diese bestehen jeweils aus 3 Grafiken: Links und rechts ein "Endstück" (je 100px breit) und in der Mitte die eigentliche Leiste als repeat-x (also als Background), wo dann der Titel der Box reinkommt. Die Box an sich soll die gesamte verfügbare Breite einnehmen. Die Endstücke sind dabei (teilwese) transparent, sodass dahinter möglichst nicht die repeat-x Grafik sein sollte
Mein Problem ist nun: Wie kriege ich die Grafiken so hingebaut, wie sie auf dem Screenshot zu sehen sind?
Die Lösung sollte nicht zu verschachtelt sein, weil ich einfach Quelltext sparen möchte. (Im aktuellen Design hab ich das zwar schon eingebaut, aber ich finde das geht eleganter als mit einer Tabelle, die ja für eine Zeile schon 3 Tags in sich verschachtelt hat (table, tr und td) und das ganze noch mit verschiedenen Klassen etc ^^ )
Deshalb meine Frage: Könnte bitte jemand von euch den passenden HTML/CSS-Code posten, der die Leiste wie oben im Screenshot erzeugt?
Ich habe mich erst vor wenigen tagen mit CSS vertraut gemacht, und habe da so noch meine kleinen Problemchen (unter anderem diese Leiste ^^)
Schonmal ein Danke im Vorraus
MfG Zwoetzen
ich bin gerade dabei, das Design meines Forums zu überarbeiten, und stehe momentan vor einem Problem, wo ich seit Tagen schon keine Lösung für finde.
Als Veranschaulichung hier eine Bildmontage, wie es am Ende aussehen soll:
[attachment=2821]
Ich habe die einzelnen Bereiche im Bild mit Rahmen abgegrenzt, damit die Aufteilung klarer wird.
Im Ganzen soll es eine Box werden, die ich später dann für viele verschiedenen Zwecke einsetzen werde (Forenanzeige der Startseite, Übersicht, Shoutbox etc.).
Der mittlere Teil wird der eigentliche Content, der soll hier nicht weiter interessieren.
Mein Problem sind die beiden Leisten oben bzw. unten: Diese bestehen jeweils aus 3 Grafiken: Links und rechts ein "Endstück" (je 100px breit) und in der Mitte die eigentliche Leiste als repeat-x (also als Background), wo dann der Titel der Box reinkommt. Die Box an sich soll die gesamte verfügbare Breite einnehmen. Die Endstücke sind dabei (teilwese) transparent, sodass dahinter möglichst nicht die repeat-x Grafik sein sollte
Mein Problem ist nun: Wie kriege ich die Grafiken so hingebaut, wie sie auf dem Screenshot zu sehen sind?
Die Lösung sollte nicht zu verschachtelt sein, weil ich einfach Quelltext sparen möchte. (Im aktuellen Design hab ich das zwar schon eingebaut, aber ich finde das geht eleganter als mit einer Tabelle, die ja für eine Zeile schon 3 Tags in sich verschachtelt hat (table, tr und td) und das ganze noch mit verschiedenen Klassen etc ^^ )
Deshalb meine Frage: Könnte bitte jemand von euch den passenden HTML/CSS-Code posten, der die Leiste wie oben im Screenshot erzeugt?
Ich habe mich erst vor wenigen tagen mit CSS vertraut gemacht, und habe da so noch meine kleinen Problemchen (unter anderem diese Leiste ^^)
Schonmal ein Danke im Vorraus
MfG Zwoetzen