Html Website anpassen

[b1zarRe]

Hey u frohes neues!

Ich habe folgende Seite gebastelt:

Nun, auf allen anderen aufloesungen als 1920px
Ist alles leicht versetzt, wie kriege ich es hin, das
Alles immer mittig bleibt !?

Vielen dank!

 

[Nick]

wie hast du's denn zentriert?

Mit
.container{
margin:0 auto;
widht:900px;
}

? Dann sollte es nicht so sein ;)

 

[threadi]

Du hast den Beitrag im falschen Forum gepostet. Dir geht es um Gestaltung, also ist es ein CSS-Thema. Daher habe ich dein Topic auch in den richtigen Bereich geschoben.

Allerdings ist dein HTML-Code noch fehlerhaft und etwas merkwürdig aufgebaut:
[Invalid] Markup Validation of http://3mm.mpalermo.de/etc/rinas/ - W3C Markup Validator

Merkwürdig finde ich z.B. dass Du HTML5 einsetzt ohne HTML5-Elemente zu verwenden. Wo ist <nav>? Wieso ist die Navigation keine Aufzählungsliste?

Bezüglich deiner Frage kann ich 2 Dinge sagen:
Zum Einen passt man keine Webseite an Auflösungen an. Eine Webseite nimmt höchstens den Bereich im Browserfenster ein, das nennt man dann Viewport.
Zum Anderen hast Du die Seite falsch aufgebaut. Alle Bereiche positionierst Du absolut oder fixizert. Auf diese Weise kann man keine Webseite zentrieren, geschweige denn in verschiedenen Viewports identisch darstellen.

Mit diesem Aufbau wirst Du nicht glücklich werden und auch keine Lösung für deine Frage finden. Ich würde dir raten alles nochmal zu überarbeiten, ohne absolute Positionierung.

 

[Tronjer]

Dazu wirst du die Seite umbauen müssen.

1. Schreibe das HTML in der Reihenfolge, in der es angezeigt werden soll. Oben der Header, dann das Menü, anschließend den Maincontent und zum Schluss den Footer.

2. Die Positionierung von HTML-Elementen soll sich der Größe des Browser-Windows anpassen, nicht umgekehrt. Lösche sämtliche CSS-Attribute, mit denen du die Seite im Viewport festnageln willst. Dazu gehören position:absolute, position:fixed sowie Angaben für Höhe, Breite, Positionierung vom Rand, etc.

3. Lege das background-image nicht in ein extra Div, sondern auf den Body oder den Container, in dem du deinen Content schreibst.

4. Der Container mit dem Maincontent erhält eine feste width aber keine height, weil er sich dann in der Höhe dynamisch anpasst. Gib ihm im CSS ein margin:auto, wenn er horizontal mittig im Browserwindow stehen werden soll.