Wie verbreitere ich die Sidebar

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    Die Breiten werden hier festlegt (style.css):

    Code
    #page {display: block; [COLOR=Blue]width: 750px;[/COLOR] background: url(images/bg_main.gif) top repeat-y; text-align: left; margin: 0 auto;}
#header {position: relative; float: left; display: block; [COLOR=Blue]width: 750px; [/COLOR]background: url(images/bg_header.gif) top no-repeat; min-height: 355px; padding: 0;}
* html #header {height: 355px;}
#content {float: left; display: block; [COLOR=Red]width: 535px;[/COLOR] margin: 0 0 0 7px;}
#sidebar {float: left; display: block; [COLOR=Red]width: 250px; [/COLOR]margin: 0;}

    Es gibt 2 Möglichkeiten:
    Blau: Gesamtbreite der Site erhöhen
    Rot: das Verhältnis von Content zu Sidebar verändern

    In beiden Fällen müssen auch die diversen background.images angepasst werden.

    Hallo, danke für die Antwort.

    wenn ich deine Zahlen wähle oder wenn ich die Zahlen im Verhältnis erhöhe, die Sidebar wird nicht breiter, nur die Werbung und die Widgets verschieben sich unter den Contentbereich.

    Gruss Veron

    Zitat

    #page {display: block; [COLOR=Red]width: 800px;[/COLOR] background: url(images/bg_main.gif) top repeat-y; text-align: left; margin: 0 auto;}
    #header {position: relative; float: left; display: block; [COLOR=Red]width: 800px; [/COLOR]background: url(images/bg_header.gif) top no-repeat; min-height: 355px; padding: 0;}
    * html #header {height: 355px;}
    #content {float: left; display: block; width: 543px; margin: 0 0 0 7px;}
    #sidebar {float: left; display: block; [COLOR=Red]width: 243px;[/COLOR] margin: 0;}

    ...

    #footer-top {display: block; [COLOR=Red]width: 800px;[/COLOR] height: 15px; background: url(images/bg_footer-top.gif) top no-repeat;}

    Wenn jetzt die Hintergrundgrafiken und die Headergrafik noch verbreitert werden, dann sollte es so klappen. Die Sidebar ist um 50px breiter.

    Entweder die Page verbreitern also der neuen Breite der Sidebar anpassen oder alle Werte innerhalb des Content verkleinern also auch der neuen Breite der Sidebar anpassen.

    Ist ja nicht nur das

    Code
    #content {
    display: block;
    float: left;
    margin: 0 0 0 7px;
    [COLOR=Red]width: 543px;[/COLOR]




}

    sondern ja einige mehr
    z.B.

    Code
    .post {
    display: block;
    float: left;
    margin: 0 0 0 18px;
   [COLOR=Red]width: 525px;[/COLOR]




}
    Code
    .wideposts .entry {
    display: block;
    float: left;
    margin: 0 0 0 5px;
   [COLOR=Red]width: 525px;[/COLOR]




}

    usw.
    und natürlich die Hintergrundgrafiken, wie schon von "bgeissler" geschrieben entsprechend anpassen

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden