Torsten: Positionierung flexibler gestalten

Hallo zusammen. Ich hab mal meine erste Seite fertiggestellt und bin noch nicht so recht zufrieden.

URL: http://www.power-spot.com

Ich habe vorher einige Seiten zu dem Thema Webdesign studiert und habe mich entschlossen die Hauptseiten ohne Tabellen zu reaslisieren. Somit habe ich die Positionierung mit CSS vorgenommen.

Wenn Ihr euch die Startseite anschaut handelt es sich bei dem linken Logo + Wasserzeichen um ein fixiertes Hintergrundblid.

Rechts daneben befindet sich ein TEXT (Drahtlos ins Internet ...) mit einem Bild auf der rechten Seite.
Der Text und das Bild sind getrennt voneinander mit CSS fixiert plaziert (top:... left:...).
So konnte ich den Text über das Bild legen.
(Noch deutlicher hier zu sehen : POWERSPOT --> PORTRAIT)

Um die Seite auch in höheren Auflösungen vernünftig erscheinen zu lassen, möchte ich nun das Bild und den Text immer zentriert plazieren.
Jedoch ohne das Text und Bild in das Logo (oben links! Das Wasserzeichen kann ruhig mit Text überlagert werden)
wandern, wenn das Fenster verkleinert wird.
Das Überlappen von Text und Bild möchte ich gernen beibehalten.

Lässt sich sowas realisieren? Muss ich wieder auf Tabellen umsteigen?
Vielen vielen dank für eure Hilfe und eure Zeit !!!
MFG
Torsten

  1. Hallo Thorsten,

    Um die Seite auch in höheren Auflösungen vernünftig erscheinen zu lassen, möchte ich nun das Bild und den Text immer zentriert plazieren.

    Setze mit <div style="text-align:center;">Bild und Text</div> ein Blockelement darüber.

    Jedoch ohne das Text und Bild in das Logo (oben links! Das Wasserzeichen kann ruhig mit Text überlagert werden)
    wandern, wenn das Fenster verkleinert wird.

    Du kannst dem Body-Tag in der CSS-Datei mit margin-top:50px; einen Abstand nach oben oder mit margin-left:20px; einen Abstand nach links geben, so dass der Seiteninhalt das Logo nicht mehr berühren kann.

    Vielleicht sind das ja ein paar Denkanstöße,

    viele Grüße,
    Calzoncillos

  2. Leider klappt das nocht nicht so richtig. Ich habe Text und Bild mit deinem Vorschlag <div style="text-align:center"></div> eingeschlossen.
    Nun ist der Text in seinem Bereich zentriert und befindet sich mitten im Bild. An der Ausrrichtung der einzelnen Elemente hat sich jedoch nicht geändert.

    Mfg Torsten

    Sorry, hier nochmal als "richtiger" Link !!!

    http://www.power-spot.com/

    1. Hat noch jemand eine IDEE ???

  3. Hi,

    zunächst: dieses scrollbare div gefällt mir überhaupt nicht. was spricht dagegen, die Seite wirklich flexibel zu halten und den Footer unter die Seite zu platzieren?
    Das Bild könntest Du ebenfalls als Hintergrundbild eines entsprechenden divs definieren. Dann sparst Du Dir die absolute Positionierung und bekommst mehr Flexibilität.

    freundliche Grüße
    Ingo