Lay / Div Positionieren Einstellungen

[wahi2005]

Hallo Leute,

Ich habe da z.b. eine Flash Seite, Auflösung 1024x768 und möchte das swf in eine div reinladen.

Soweit, so gut.

Nun möchte ich dieses Div/layer immer in der Mitte haben.

Hat jmd eine Idee?

gruss

chris

[Conny]

Hi Chris,
einen DIV-Container mittig positionieren ist nicht sehr schwer, vorauszetzung ist aber eine feste Weite und Höhe für diesen Container.

Hier ein Beispiel:
<DIV STYLE="position: absolute; top: 50%; left: 50%; width: 660px; height: 400px; margin-top: -200px; margin-left: -330px;">
Der Container hat eine Höhe von 400 Pixel und eine Weite von 660 Pixel; diese Angaben lassen sich natürlich beliebig verändern.
Denke aber daran, daß die Margin-Angaben im direkten Zusammenhang mit Höhe und Weite stehen (also mit verändern).

Im Body Tag solltest Du noch die STYLE-Angabe text-align: center; machen.

Am Besten alles in einer CSS-Datei auslagern und den TAG mit Class oder ID versehen.

Sicherlich gibt es noch ander Möglichkeiten zu Zentrieren; der gute alte <Center> Tag würde es beispielsweise auch (noch) tun.

cu
Conny

[i.b.g]

Hallo,

auf CSS4YOU gibt es jede Menge Anregungen. Eine davon findest Du >>> HIER <<<. Eine sehr elegante Lösung und Cross-Browser.

[wahi2005]

vielen vielen dank euch beiden!

Ihr habt mir sehr geholfen!

[mondspeer]

Hallo Miteinander,

das ist ein schöner css-code.

Habt Ihr eine Idee, wie ich das abändern kann, wenn ich drei div-Bereich habe, bei denen jeder von der Hintergrundfarbe her die komplette Seitenbreite ausfüllen soll, der eigentliche Inhaltsbereich aber auf beiden Seiten einen gleich großen (Innen-) Abstand haben.

Ginge das also z.B. mit padding statt margin?

Und wie bekommen ich es hin, dass die drei div-Bereiche jeweils oben und unten keinen Abstand haben?

Keep on coding,
mondspeer

[mondspeer]

Nachtrag:

Ich habe es jetzt anders gemacht.

QUELLTEXT

.header, .footer {
     width: 100%;
     min-width: 760px;
     height: 22%;
     min-height: 210px;
     padding-left: 16%;
     padding-right: 16%;
     padding-top: 10px
     padding-bottom: 10px;
     }

.main {
     width: 100%;
     min-width: 760px;
     height: 56&;
     min-height: 280;
     padding-left: 16%;
     padding-right: 16%;
     padding-top: 10px;
     padding-bottom: 10px;
     background-color: #ffffff;
     }

Jetzt habe ich die Bereiche auch zentriert, durch die witdt=100% verläuft die Hintergrundfarbe über die gesamte Breite und der Text konzentriert sich dennoch auf einen festgelegten Mittelbereich.

Dennoch danke für die Anregung.

Keep on coding,
mondspeer

Der Beitrag wurde von mondspeer bearbeitet: 10.02.2006 - 12:53

[Google Bot]