Seite Zentriert anzeigen

[Timmer]

Hi, ich habe eine motd.txt für meinen Gameserver geschrieben. Jetzt möchte ich, dass die Seite zentriert angezeigt wird, also dass der User in der mitte der Seite startet. Scrollen ist nicht erlaubt. Darauf ist ein Bild, das größer ist, als die Seite. Das soll nach allen Seiten hin über den Rand gehen, also durch den Bildschirm-/Fenterrand abgeschnitten werden.

Es soll also immer der Mittelpunkt des Bildes angezeigt werden und je nach größe des Fensters mehr oder weniger vom Rand des Bildes...

Hab die ganze Zeit schon gegooglet, entweder google ich nach was falschen oder ich find echt nix...

[EDIT]

Hier mal ne Vorschau der motd.txt: Klick

 

[Loon3y]

Zentrieren kann man ein Element indem man ihm eine feste breite gibt und margin:0em auto; ihm zuweißt.

Sprich:

img.deinbild { width: 20em; margin: 0em auto; }

statt dem img mit klasse, kannst du natürlich auch andere elemente wie <div> oder <p> usw. usf. zentriert darstellen. Alternativ, bei Text, könntest du auch text-align:center; benutzen.

Wenn du das Bild als Hintergrund mit CSS eingebunden hast, kannst du auch folgendes benutzen:

background-image: url('deinbild.png');
background-position: center;
background-repeat: no-repeat;

background-position: Hintergrund positionieren: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets

Grüße
Loon3y

 

[Efchen]

Alternativ, bei Text, könntest du auch text-align:center; benutzen.

Nicht nur bei Text, obwohl der Name der Eigenschaft das vermuten ließe. Diese Methode funktioniert für alle Inline-Elemente, die mit dem margin für alle Block-Elemente (IE nur im Standards Mode).

 

[Loon3y]

Nicht nur bei Text, obwohl der Name der Eigenschaft das vermuten ließe. Diese Methode funktioniert für alle Inline-Elemente, die mit dem margin für alle Block-Elemente (IE nur im Standards Mode).

ja ok, hast recht, endschuldigung! ^^ *niederkniee und um gnade fleh* ;D

 

[Timmer]

Naja, so hab ich das ja eigentlich nicht gemeint

Also mittlerweile geht es darum, eine Seite zentriert anzuzeigen und den Rest, der nicht mehr draufpasst auf beiden Seiten über den Rand geht.

Hier mal kleines Beispiel:

So solls nich aussehen: Klick
Es soll wie hier an beiden Seiten über den Rand gehen: Klick

Der Teil, der nicht mehr zu sehen ist, ist mit dem Gitter gekennzeichnet!

Könnt ihr mir helfen? Ich weiß grad nich, wie ich das machen soll...

 

[Loon3y]

Also bei bildern könntest du das mit via CSS so machen:

overflow:visible;

Sofern das Bild größer ist, als das Element in dem es ist.

SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

Gruß
Loon3y

 

[Timmer]

Gehts auch mit was andrem? z.B. Tabellen?

 

[Efchen]

Du willst doch was zentrieren, also die Optik verändern. Was kann denn das mit Tabellen zu tun haben? CSS ist für die Optik zuständig, HTML doch nur für die logische Bedeutung des Inhalts. Aus Deinem Inhalt werden ja nicht plötzlich tabellarische Daten, nur weil Du sie zentrieren willst.

 

[Timmer]

Also ich habs jetzt mal ausprobiert mit overflow: visible und es funktioniert komischerweise nicht .__.