hilfdirselbst.ch
Facebook Twitter gamper-media

Forum: HTML und CSS / Stylesheets

Tömsken
Beiträge: 720
11. Jun 2004, 17:17
Beitrag #1 von 6
Bewertung:
(2580 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Layer per CSS auf der Seite zentrieren


Salut.

Ich wollte es nun doch mal wissen - und bin gescheitert:
Wie zentriert man einen Layer (von z. B. 300 x 200 Pixel) auf einer Seite ohne JavaScript und unabhängig von der Festergröße des Browsers?

position: relative; top: 40%; right: 50%; bottom: 50% left: 40%;

ist zwar ein Ansatz, da aber abhängig von der Größe des Layers eher "unbefriedigend".
Bessere Vorschläge? Top
 
X
SabineP  M 
Beiträge: 7586
11. Jun 2004, 17:24
Beitrag #2 von 6
Beitrag ID: #90458
Bewertung:
(2580 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Layer per CSS auf der Seite zentrieren


Hallo Tom, mein Vorschlag

CSS
#layer{witdh:300px; height:200px}

HTML
<div id="layer" align="center">bla blu</div>

Gruß Sabine
als Antwort auf: [#90455] Top
 
Tömsken
Beiträge: 720
11. Jun 2004, 18:40
Beitrag #3 von 6
Beitrag ID: #90465
Bewertung:
(2580 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Layer per CSS auf der Seite zentrieren


Ok, so weit, so klar. Aber: Wie geht's vertikal?
als Antwort auf: [#90455] Top
 
SabineP  M 
Beiträge: 7586
11. Jun 2004, 22:24
Beitrag #4 von 6
Beitrag ID: #90488
Bewertung:
(2580 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Layer per CSS auf der Seite zentrieren


Hallo Tom, wenn der Layer unbedingt vertikal zentriert werden soll (Browser mögen das nicht so sehr),
dann greife ich immer noch zum verbotenen Attribut height="100%" (Achtung Ausnahme!) für Tabellen.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style type="text/css">
#layer{width:200px; height:200px; border:solid 1px}
</style>
</HEAD>

<BODY>

<table width="100%" height="100%">
<tr><td align="center"><div id="layer">blu</div></td></tr>
</table>

</BODY>
</HTML>

Eine bessere Variante, die in allen Browsern (Opera ungetestet) funktioniert, habe ich leider auch noch nicht gefunden.

Gruß Sabine
als Antwort auf: [#90455]
(Dieser Beitrag wurde von SabineP am 11. Jun 2004, 22:26 geändert)
Top
 
Tömsken
Beiträge: 720
11. Jun 2004, 23:45
Beitrag #5 von 6
Beitrag ID: #90509
Bewertung:
(2580 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Layer per CSS auf der Seite zentrieren


Hi Sabine,

danke für den Hinweis. Ich dachte, dass es mittlerweile etwas "Schickeres" geben würde - nun ja, dann eben nicht ;)

Ich habe bislang noch keine Website ausschließlich mit Layern aufgebaut, stattdessen immer Tabellen genommen. Nun "experimentiere" ich z. Z. damit, um herauszufinden, was denn der bessere, zeitgemäße Weg ist. Gerade mit Blick auf NS 4 bin ich recht skeptisch, wenngleich dessen Marktanteil eigentlich ein "Ignorieren" erlauben sollte... na, ich weiß nicht... ist schon doof, wenn der Kunde denn doch einen NN 4 einsetzt und man das erst mal erklären muß...

Ciao, Tom
als Antwort auf: [#90455] Top
 
SabineP  M 
Beiträge: 7586
12. Jun 2004, 00:05
Beitrag #6 von 6
Beitrag ID: #90511
Bewertung:
(2580 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Layer per CSS auf der Seite zentrieren


Hi Tom,

ausschließlich mit Layern habe ich auch noch keine Seite gebastelt, ein oder zwei Tabellen waren immer dabei.
Aber das macht ja nichts, Tabellen sind ja nicht verboten.

Ich habe in meinen Bookmarks noch zwei Links gefunden die sich mit CSS - Layouts beschäftigen,
die auch in Netscape 4 funktionieren.

http://www.saila.com/...ts/nn4-layouts.shtml
http://www.fu2k.org/alex/css/

Interessant finde ich die Beispiele von Projectseven (without scripts/ohne JavaScript):
http://www.projectseven.com/...box/2boxnoscript.htm
http://www.projectseven.com/...box/3boxnoscript.htm

Vielleicht ist etwas dabei was Dir gefällt.

Gruß Sabine
als Antwort auf: [#90455]
(Dieser Beitrag wurde von SabineP am 12. Jun 2004, 00:12 geändert)
Top
 
X