Allgemeine Probleme

[MrMurphy1]

Hallo

Eine Breitenangabe war beabsichtigt da der Inhalt auf große Bildschirme ziemlich verloren aussieht.

Das ich ein Grundlayout erstellt habe hast du aber schon verstanden? Abstände, Farben und weiteres müssen natürlich noch angepasst werden. Dafür ist es auch ausgelegt.

Wenn du eine durchgehende Breite haben willst weist du diese einfach dem body oder dem main- und dem footer-Element zu und zentrierst mit margin-left und -right: auto.

Du meinst wahrscheinlich "div-container-->main"? Macht das einen Unterschied?

Optisch nein - semantisch ja.

Bei Beispielen sieht man sehr oft <div id="contain">.

Die sind veraltet.

Das Problem ist nur, daß der Inhalt bei einem kleineren Bildschirm aus dem Container hinaus läuft.

Kein Ahnung was du meinst. Wenn du keine Höhe vorgibst kann der Inhalt auch nicht über den Container hinausgehen. Oder du hast an anderer Stelle eine Dummheit eingebaut. Bei meinem Layout läuft jedenfalls kein Inhalt aus einem Container.

Mit Deiner Erlaubnis habe ich mir diese Zeilen kopiert. Sollte das in allen Homepages bzw. Teilseiten stehen?

Sicher. Das sind CSS-Angaben, die eigentlich nur einmal in eine zentrale CSS-Datei eingegeben werden und dann für alle verknüpften HTML-Seiten gelten. Sie nützen aber nur etwas mit der Verknüpfung zu html5shiv und sorgen dafür, das die neuen Elemente von älteren IE als Blockelemente erkannt werden. html5shiv muss wiederum in den head-Bereich jeder Seite eingefügt werden. Außer du benutzt php, wovon ich nicht ausgehe.

  * {
     box-sizing: border-box;
  }

Soweit ich jetzt verstanden habe, Sind die Rahmen, etc. in der Breitenangabe inkludiert?

Padding und border. Das erleichtert die Breitenberechnungen bei mehrspaltigen Layouts.

  html {
     font-size: 120%;
  }

Wird das normal nicht im body geschrieben?

Nein, da ich rem als Schriftgrößeneinheit verwende. Du kannst natürlich auch px, em oder % verwenden, dann bringt der Eintrag nichts. Die Einheiten sind aber veraltet, googeln hilft.

  main {
     overflow: hidden;
  }

Dieses Overflow habe ich nun auch bei meinem Container gemacht. Scrolling ist anscheinend standardmäßig da sich mit overflow: scroll kein Unterschied zeigt.

Das "overflow: hidden" dient in diesem Fall dazu die Floats einzuschließen und so auf ein globales clear verzichten zu können. CSS-Anweisungen zu verwenden ohne ALLE Auswirkungen zu kennen ist keine gute Idee.

Sollte Ordnungshalber doch main anstatt div verwendet werden? Gibt es da Unterschiede?

Main ist aktuell. Wer veraltetes HTML erstellen will kann gerne div verwenden. Von der Darstellung spricht nichts dagegen.

Da ist ein Unterschied. Bräuchte ich dann "#navrahmen" gar nicht?

Nein. Anfänger neigen gerne dazu unnötige Container zu verwenden. Das ist schlechter Stil, erfordert unnütze zusätzliche CSS-Angaben und erschwert die Übersicht im Quelltext. Der HTML-Quelltext soll so schlank wie möglich bleiben, auf Elemente nur zum Layouten sollte verzichtet werden.

Bleibt sich das nicht gleich ob ich div oder article verwende da es sich ja um keinen abgeschlossenen Artikel sondern einen Gesamtinhalt?

Da deine Seite überhaupt noch keinen Inhalt hat kann das niemand außer dir beurteilen. Wenn du keinen Inhalt lieferst (und Blindtexte sind kein Inhalt) kann ich nur raten. Ein div sehe ich jedenfalls nicht. Es steht dir trotzdem frei es zu verwenden, das ist schließlich deine Seite.

/* Vorlage zum Kopieren für Media-Query */ @media only screen and (max-width: 0px) { } Eine Erklärung dazu finde ich nirgends. Auch nicht bei "http://wiki.selfhtml.org/wiki/CSS/Media_Queries". Diese Erklärungen sind für mich noch etwas unverständlich.

Das ist einfach eine Vorlage für mich falls ich MediaQueries erstellen möchte. Dann kann ich den ganzen Kram einfach kopieren. Zur Zeit hat das keine Auswirkungen.

Da ich deinen Kenntnisstand nicht kenne kann ich dir nur eine Grundstruktur mit aktuellem HTML / CSS aufzeigen. Da das Web nichts vergißt wirst du dort mehrheitlich auf veraltete Lösungen treffen.

Was du damit machst musst du selbst entscheiden. Wenn du älters HTML / CSS bevorzugst - deine Entscheidung.

Gruss

MrMurphy