Bitte um kurzen Check! Danke!

funkytown

Hallo,
könnt ihr mal mit einem Internet Explorer (Windows) checken, ob diese Seite korrekt dargestellt wird?

Hintergrund: Ich hatte eine korrekte Darstellung in Firefox. Beim IE hat er mir aber die Abstände unten bei den Widgets, also Sidebar zerhauen. Ich hab jetzt folgendes gemacht:

Code

.ancillary .sidebar{
    float:left;
    padding: 15px;
    width: 265px;
    margin:0 0 0 20px;    
    background: transparent url(images/transparent_bg.png) repeat left top;

Ich habe alle Prozentangaben bei padding, width und margin durch px-Angaben ersetzt.

Ich hoffe das war die richtige Methode. Bitte um Feedback der IE User.
Danke
Funky

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

funkytown

Kann mir keiner helfen? Ich hab nur einen Mac. Der kurze Test mit einem IE heute Mittag hab ich in einem Internetcafe gemacht...

spickzettel

Härtetest im IE6: nur die erste Spalte wird angezeigt. Auch im Firefox wandert die dritte Spalte nach unten. Vielleicht liegt's an den HTML-Fehlern...

funkytown

Danke für die Antwort. Seltsam. Im Firefox für Mac OS X sieht alles super aus. Frag mich gerade wie ich das Problem lösen soll, wenn ich keinen IE6 zur Kontrolle hab.

spickzettel

browsershots.org ?

funkytown

Das kannte ich nicht. Werde ich mal gucken.

SOOOO! Hab alle Fehler ausgemerzt:
This document was successfully checked as XHTML 1.0 Transitional!

Kannst Du nochmal nachgucken ob der IE6 es jetzt richtig darstellt??

funkytown

Zitat von spickzettel

browsershots.org ?

Tolle Seite. Hab jetzt mal gecheckt. Ich bekomme bei allen Browsern das gleiche angezeigt. Das letzte Widget rutscht immer in den nächste Zeile und ich habe keine Ahnung warum...

spickzettel

Code

.inside{
    width:80%;}

ein bisschen hochsetzen hilft im Firefox, aber nur 1024px breitem Fenster. Wenn das Fenster schmaler wird, wandert die Sidebar wieder nach unten. Im IE6 sieht es (bei breitem Fenster) gut aus.

funkytown

Erst mal danke. Ich hab noch ein anderes Problem. Wenn ich in einer Sidebar 2 Widgets untereinander habe, reicht mir der Abstand nicht.

Also derzeit sind ja in der Mitte der Text und das Bild, darunter das Widget Kategorie. Ich möchte den Abstand etwas vergrößern und finde nicht den entsprechenden Eintrag im Code:

Code

.ancillary{
    background:#000 url(images/bg_ancillary.jpg) top repeat-x;
    padding:2em 0 2em 0;
}
.ancillary .sidebar{
    float:left;
    padding: 1%;
    width: 28%;
    margin:0 0 0 2.5%;    
    background: transparent url(images/transparent_bg.png) repeat left top;
}
* html .ancillary .sidebar{
    background:none;
}
.ancillary .twice-length{ width:65%; }
.ancillary .thrice-length{ width:100%; }
.ancillary .first {
    clear:both;
    margin:0 0 0 2.4%;
}
* html .ancillary .first {
    clear:both;
    margin:0;
}
.ancillary .block-separator{
    clear:both;
    height:2.5em;
}
.ancillary .sidebar h2, .ancillary .sidebar h3{
    margin:0 0 2em 0;
    color: #FF9900;
}
.divider {
    border-bottom:1px solid #3D3D3D;
}
ul.sidebar li {
    list-style-type:none;
    margin:0;
}
ul.dates, ul.counts, ul.blogroll ul, ul.pages, ul.sidebar li.widget ul{
    list-style-type:none;
    margin:1.5em 0 2em 0;
    border-top:1px solid #3D3D3D;
}
ul.dates li, ul.counts li, ul.blogroll ul li, ul.pages li, ul.sidebar li.widget ul li{
    list-style-type:none;
    margin:0;
    padding:0.5em 0;
    border-bottom:1px solid #3D3D3D;
}
ul.dates .date{
    color:#858585;
    padding:0 1.5em 0 0;
}
ul.counts .count{
    float:right;
    color:#858585;
}
ul.dates a, ul.counts a, ul.blogroll a, ul.pages a, ul.sidebar li.widget ul a{
    color:#BFBFBF;
    text-decoration:none;
}
ul.dates a:hover, ul.dates a:hover .date, ul.counts a:hover, ul.counts a:hover .count, ul.blogroll a:hover, ul.pages a:hover, ul.sidebar li.widget ul a:hover{ 
    color:#FFF;
}
ul.blogroll{ margin-top:0; }
ul.blogroll li{
    list-style-type:none;
    margin:0;
}
ul.pages ul{
    margin:0;
}
ul.pages ul li{
    border:none;
    margin-left:2em;
    list-style-type:square;
}
/*block items*/
ul.recent-comments li a{
    color: #FF9900;

Alles anzeigen

spickzettel

Code

ul.sidebar li.widget {padding-bottom:60px;}

funkytown

Du bist klasse :-)

Wo muss ich den Code einfügen? Egal?

spickzettel

Am besten am Ende.

funkytown

du bist klasse. hat funkioniert!

wenn ich noch eine frage stellen darf.

wenn ich das fenster kleiner ziehe, dann ist mir der abstand zwischen dem content (2 artikel) und bottom zu gering. bei großem fenster ist der abstand perfekt. wie kann ich das ändern?

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Bitte um kurzen Check! Danke!

Jetzt mitmachen!