✔ Probleme mit CSS zu layouten

Status
Nicht offen für weitere Antworten.
E

ede592

Mitglied
Guten Tag zusammen,

Ich habe mir kürzlich eine Webdesign mit Photoshop ausgetüftelt und wollte jetzt das ganze mit css zusammensetzten.
Hab das Design mal hochgeladen, damit euch mein Problem vllt besser kla wird:
http://rollbrettgurken.de/deeesign.jpg
Also meine Vorstellung ist die, dass Ich die einzelnen Bildelemente:
- Wassereffekt (als Footer mit repeat-x)
- Contentbereich, der den Footer teils überlagert (möglich?)
- Strahlen, die Content & Footer überlagern sollen (möglich?)
- Logo
die Ich aus dem Design separat extrahiert habe mit css als background-image elemente zusammensetze. Mein Problem dabei ist allerdings, dass ich ungefähr Null Ahnung im Umgang mit CSS habe es meiner Meinung nach aber die schönste Alternative wäre, da wenn möglich, die farbigen strahlen den Contentbereich überlagern, was ein tollen Effekt erzielen würde.

Konkret:
1. Wie definiere Ich wasser.png als Footer in meiner seperaten layout.css (an unteren Bildrand ausrichten und mit repeat-x wiederholen) und mit was für Elementen füge Ich es am besten in die HTML ein?
2. Wie richte ich den Content mittig aus, sodass (wie in deeesign.jpg zu sehen ist) er über dem footer liegt?
3. Wie lege ich die strahlen.png über Content & Footer?
:confused::confused:

Ich hoffe, dass es überhaupt möglich ist und freue mich über alle konstruktiven Antworten!
 
Wovon redest du?

Es wäre zudem sehr hilfreich, in der Vorschaugrafik die einzelnen Segmente zu markieren und ihrer Verwendung in der Seite entsprechend zu beschriften.

Wenn man so einen konkreten (detailierten) Überblick vom angedachten Seitenaufbau gewinnt, lässt sich auch was zur möglichen Umsetzung sagen.

mfg Maik
 
Ich rede von der einzelnen Anrodung der Bildelemente:
- Footer
- Content
- Strahlen
- Logo

also ich will diese einzlenen Sachen, die ich noch in separaten png´s habe, so anordnen wie in dem Design (jetzt auch mit Markierungen ;)):
http://rollbrettgurken.de/deeesign_lay.jpg

Für die Navigation, wollt Ich einfach in die oberste Contentzeile ein paar horizontal nebeneinaderstehende Links einfügen...
 
Zuletzt bearbeitet:
Besitzt das spätere Seitenlayout eine feste Höhe? Oder soll die Höhe variabel sein, und sich dem Seiteninhalt entsprechend anpassen?

mfg Maik
 
Eigentlich hab ich mir das so gedacht, dass die Gesamthöhe variabel sein soll, sprich sich der Footer immer am unteren Bildrand orientiert.
 
Tja, dann hast du hier schon das erste Problem, bevor du deine Arbeit überhaupt richtig aufgenommen hast.

Denn wie soll sich deiner Meinung nach die schräge Rahmenführung des Inhaltbereichs nach unten fortsetzen?

Ein Hintergrundbild kann nur waagerecht und senkrecht wiederholt werden, womit sich der linke und rechte Rahmen mit jeder weiteren Inhaltszeile gegenüber der Ausgangssituation nach rechts verschiebt, und sich so ein "treppenartiges" Gebilde ergibt.

mfg Maik
 
Also der Content bereich ist im Prinzip nur ein Hintergrundbild welches transparente ränder hat.
Der eigentlicht Content befindet sich in einem Quadratischen Bereich innerhalb des Contents:
http://rollbrettgurken.de/content_lay.png

Außerdem soll sich dieser Komplette Bereich in der vertikalen & horizontalen Mitte des Bildes befinden, was bei meinem Design beispiel doch etwas schlecht rüberkommt ;)

MfG Ede
 
Zuletzt bearbeitet:
ede592 hat gesagt.:
Also der Content bereich ist im Prinzip nur ein Hintergrundbild welches transparente ränder hat.
Der eigentlicht Content befindet sich in einem Quadratischen Bereich innerhalb des Contents:
http://rollbrettgurken.de/content_lay.png
Zum Vergrößern anklicken....
Ja und?

Dass der eigentliche "Content"-Bereich quadratisch (rechtwinklig) ist, liegt in der Natur der Sache, da HTML-Elemente nur in diesem Format (Breite * Höhe) zur Verfügung stehen.

Der untere Abschluß des grauen Rahmens gehört zum Footer, und dieser soll nach unten geschoben werden, wenn der Inhalt zunimmt.

Bei der schrägen Rahmenführung hieße das, dass mit jeder weiteren Inhaltszeile der mittlere Rahmenbereich, der hierfür nach unten wiederholt wird, sich dem Steigungsverhältnis entsprechend nach links verschieben, aber auch der komplette Footerbereich entsprechend nach links wandern müsste, damit die drei Rahmensegmente (oben - miite - unten) nahtlos zueinander passen.

Und das lässt sich nicht umsetzen.

Zumal auch der Inhalt senkrecht verläuft, und ab einer gewissen Zeilenanzahl aus diesem Rahmen laufen würde.

Da wirst du dir ein anderes Layoutkonzept in Photoshop basteln müssen.

mfg Maik
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück