Sidebar-Design zerschossen und finde den Fehler nicht

Clodinchen

Ich habe mit dem Design meiner sidebar experimentiert und jetzt ist es zerschossen und finde den Fehler nicht. Ich habe zwar alles wieder auf den Ursprung zurückgesetzt, aber es geht nicht.

Normaler Weise sollte die Sidebar am oberen Rand vom Artikelbild anhaken, aber sie ist irgendwie nach unten gerutscht.

http://ayco.pf-control.de/Wordpress/2011/08/spas-am-abend/

Hier ist der style.css. Alle Änderungen hab ich auch da gemacht.

PHP

#sidebar {
    float:right;
    width:220px;
    color:#333;
          line-height:36px;
border:#DDD 2px solid;
}


.widget {
    margin-bottom:20px;


}


.widget h3 {
    margin-bottom:0;
    color:#255;
    font-size:20px;
}


.widget ul {
    list-style:none;
    margin:0;
}


.widget ul ul {
    margin-left:15px;
}


.widget ul li {
    margin:0;
    
}


.widget ul ul li {
    border-bottom:none;
}

Alles anzeigen

Bitte helft mir, den Fehler zu finden.

Werbepost

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

spickzettel

Durch den Border (2px) ist die Sidebar 4px zu breit, Also die Breite verringern:

Code

#sidebar {
...
    width:216px;

Oder besser den Container breiter machen, sonst passt Facebook nicht in die Sidebar:

Code

#container {
...
    width: 944px;

Clodinchen

ich habe es ausprobiert. An der Sidebar selbst tut sich was. Also wenn ich sie kleiner mache und die Widgets kleiner mache, wird das alles übernommen. Aber es rutscht immer noch nicht hoch. Also die Widgets haben jetzt eine Breite von 216px, auch der FB-Container.

der Code sieht jetzt so aus:

PHP

#sidebar {
    float:right;
    width:216px;
    color:#333;
          line-height:36px;
border:#DDD 1px solid;


}


.widget {
    margin-bottom:20px;


}


.widget h3 {
    margin-bottom:0;
    color:#255;
    font-size:20px;
}


.widget ul {
    list-style:none;
    margin:0;
}


.widget ul ul {
    margin-left:15px;
}


.widget ul li {
    margin:0;
    
}


.widget ul ul li {
    border-bottom:none;
}

Alles anzeigen

Tutrix

du kannst auch den Content kleiner machen

Code

#content {
    float: left;
    margin: 0 20px 0 0;
    width: 700px;




}

statt 700px nur 695px, dann ist die Sidebar wieder oben

Clodinchen

es hat funktioniert....danke, Problem gelöst :)

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Sidebar-Design zerschossen und finde den Fehler nicht

Jetzt mitmachen!