K-COM: Inhalt in die Mitte

Hi Leute,

ich hab ein Problem! Ich habe eine Website auf 1024x768 optimiert, also ist sie z.B. bei 1280x1024 links oben in der Seite!
Jetzt habe ich im Stylesheet folgende angaben gemacht: #center {margin:1px auto 1px auto;} im Body Bereich habe ich dann gleich hinter den Body-Tag folgendes gemacht: <div id="center"> und nach dem ganzen restlichen "gefunzel" mit </div> abgeschlossen!
Jetzt hatte ich erwartet dass alles in der Mitte ist! aber nichts is!! Wo ist was falsch?
Ich habe das Grundgerüst mal hochgeladen: http://k-com.piranho.com/vorlage.htm

Danke schonmal
K-COM

  1. Hallo!

    ich hab ein Problem! Ich habe eine Website auf 1024x768 optimiert, also ist sie z.B. bei 1280x1024 links oben in der Seite!

    Wenn die Seite nicht eine pixelgenaue Größe hat dann wäre es besser mit Einheiten wie em, ex oder % das Layout zu gestalten.

    Jetzt habe ich im Stylesheet folgende angaben gemacht: #center {margin:1px auto 1px auto;} im Body Bereich habe ich dann gleich hinter den Body-Tag folgendes gemacht: <div id="center"> und nach dem ganzen restlichen "gefunzel" mit </div> abgeschlossen!
    Jetzt hatte ich erwartet dass alles in der Mitte ist! aber nichts is!! Wo ist was falsch?

    Einfach #center auch eine Breite und da du die Elemente mit position:absolute ausrichtest dem #center div auch position:relative geben, dann sollts passen.

    --
    Lg,
    Snafu
  2. Hallo,

    Hi Leute,

    ich hab ein Problem! Ich habe eine Website auf 1024x768 optimiert, also ist sie z.B. bei 1280x1024 links oben in der Seite!
    Jetzt habe ich im Stylesheet folgende angaben gemacht: #center {margin:1px »» Jetzt hatte ich erwartet dass alles in der Mitte ist! aber nichts is!! Wo ist was falsch?

    Ich vermute mal, das du body und html keine Breite von 100% gegeben hast.

    Auf das Center-Div kannst du aber auch verzichten, weise die Sachen der Center-Klasse einfach dem body-Element zu.

    Noch ein paar Anregungen/ein wenig Kritik:

    Ferner solltest du den Hintergrund ebenfalls über CSS zuweisen, sowie auf sämtliche andere Formatattribute (text="...", border="0" etc.) verzichten und das ebenfalls per CSS machen.

    Nächster Punkt, das index-Div kannst du dir sparen, pack die Links in eine ul und formatiere diese direkt. Das Menü schreit geradezu: Ich bin eine Liste!

    Auch die <br /> solltest du rausschmeißen und diesen Effekt möglichst über margins durchführen.

    Außerdem fällt mir auf das deine Elementschachtelung etwas merkwürdig ist. Ein <span> darf z.B. keine Blockelemente wie <h3> enthalten.

    Tipp: Kümmere dich erst mal überhaupt nicht um die Gestaltung, sondern verpacke deinen Inhalte zuerst in semantisch korrektes HTML (immer wieder durch den Validator jagen). Erst wenn du Inhalte hast, gehst an die Gestaltung, die vollständig mittels CSS erfolgt.

    Was deine Optimierung an 1024x768 angeht: Ich bin ein Fan von so genannten fluiden Layouts, die sich an Größe des Browserfensters anpassen. Dass aber - um keine zu langen, schlecht lesbaren Zeilen zu bekommen mit einer Beschränkung der Breite auf ca. 1000 px mittels max-width.

    Ein Wort zur farblichen Gestaltung: Denk noch mal drüber nach. Gut lesbar ist schwarz auf rot nicht gerade.

    Gruß

    Stareagle