Inhaltscontainer im IE zu breit und ungewollte Scrollbalken.

[satre]

N'Abend,
ich habe wieder Probleme mit dem IE.

Auf einigen meiner Seiten ist der Inhaltscontainer zu breit, so dass die Seitennavigation nach unten verschoben ist. (Screenshot 1). Zum Beispiel auf dieser Seite.

Das komische daran ist, dass das Layout einheitlich mit der gleichen CSS festgelegt ist. Trotzdem taucht dieses Problem im IE bei einigen Seiten auf, was für mich unerklärlich ist.

Auf dieser Seite spendiert mir der IE sogar noch schicke Scrollbalken. (Screenshot 2)

Über Hilfe bin ich wie immer dankbar.

[newcommer]

Zur Navi ...
habe leider keinen IE6 auf meinem Rechner installiert (da ist schon der 7er drauf), habe aber das gleiche Problem auch beim FF feststellen können (maximiertes Browserfenster bei 1400 x 1200 Auflösung) ... hier verschwand das Problem beim Ändern des padding von 6px auf 4px im #right Container ... Ob das den gewünschten Erfolg im IE bringt weiss ich allerdings nicht ;-)
Zumal die Navigation nach einem Reload der Seite an die Richtige Stelle springt ...

[IMBild]

Morgen,

Versuch mal deinen footer entweder rechts oder links zu floaten anstatt in zu "clearen",.. frag mich nu bitte nich warum, aber ich glaube so könnte das funktionieren.

Und wegen dem Scrollbalken könntest du versuchen das overflow:auto in deinem #wrap in overflow: hidden zu tauschen.

Hmmm könnte nun auch völlig daneben liegen,.. aber ein versuch könnte es wert sein ...

[Palorux]

hallo satre,

ich bin zwar nicht der provie in sachen css aber vieleicht hilft dir das weiter.
bau doch das design von hier nach : schau hier das klappt in allen browsern so viel ich es weiss...

[satre]

habe aber das gleiche Problem auch beim FF feststellen können

Welche Version?

Zitat von newcommer

hier verschwand das Problem beim Ändern des padding von 6px auf 4px im #right Container ... Ob das den gewünschten Erfolg im IE bringt weiss ich allerdings nicht ;-)
Zumal die Navigation nach einem Reload der Seite an die Richtige Stelle springt ...

Auf diese Weise funktionierts, nur entsteht dadurch im Firefox eine 4px Breite Lücke in der oberen gestrichelten Linie, was an sich nicht so schlimm wäre.

Ich habs noch mal nachgerechnet:

#content: 587px (width) + 1px (border) + 40px (padding) = 628px
#right: 160px (width) + 12px (padding) = 172px

628px+172px= 800px.

Das müsste doch eigentlich richtig sein.

[satre]

Wo sind denn unsere CSS-Profis?
Da muss doch was zu machen sein.

[Sand*mann]

Zitat von satre

Wo sind denn unsere CSS-Profis?
Da muss doch was zu machen sein.

Heute ist hier irgendwie tote Hose. Keiner da..

[Adromir]

Vieleicht hats damit zu tun (Ergebnis vom CSS- Validator):
Zeile: 27 Kontext : .trenn

Die Eigenschaft line-heigt existiert nicht : 150%

[newcommer]

Hallo satre ... sorry, aber war übers wochenende etwas "feiern" ... und den gestrigen tag habe ich gebraucht, um mich selbst wieder anzulernen ;-)

Glaube Dein Problem gefunden zu haben:

Wenn ich die Werte zusammenzähle komme ich auch auf 800px ;-)
Schlecht dabei ist nur, dass ich eigentlich nur 798px zur Verfügung habe !!!

In Deinem DIV#wrap hast Du ein Padding von 0 1px angegeben ... und alle anderen DIV's liegen darin -> ergo -> zu wenig Platz !!!
Allerdings reicht es dem IE noch nicht das Padding zu entfernen (?) ... Für den IE musst Du noch den DIV#content um einen Pixel verkleinern (586px) ...

Dann sollte es auch mit dem Kollegen aus Redmond funktionieren ...

Hoffe mal das bringt Dich weiter ;-)

[satre]

Zitat von Adromir

Vieleicht hats damit zu tun (Ergebnis vom CSS- Validator):
Zeile: 27 Kontext : .trenn

Die Eigenschaft line-heigt existiert nicht : 150%

Da habe ich wohl das "h" in height vergessen. Danke für den Hinweis.

In Deinem DIV#wrap hast Du ein Padding von 0 1px angegeben ... und alle anderen DIV's liegen darin -> ergo -> zu wenig Platz !!!

Da haste Recht.

Allerdings reicht es dem IE noch nicht das Padding zu entfernen (?) ... Für den IE musst Du noch den DIV#content um einen Pixel verkleinern (586px)

Danke. So funktionierst sogar (bis auf eine Ausnahme) mit dem doofen Internet Exploder.
Auch wenn ich nicht weiß, warum ein beim IE ein Pixel subtrahiert werden muss.

#wrap {
margin:0 auto;
padding:0px;
border-left:1px solid black;
border-right:1px solid black;
width:800px;
overflow:auto;
background: url(/bilder/faux.png) 0 0 repeat-y;
}

#content {
width:586px;
background-color:white;
border-top:2px dotted #aaa;
border-right:1px solid #aaa;
padding:20px;
float:left;
}

[newcommer]

schön dass es klappt ;-)

und glaubst du wirklich dass es jemanden auf dieser Welt gibt, der die Marotten unseres Methusalem aus Redmond (für die, die es nicht verstehen, der IE) versteht ??? Ich nicht ;-)

Und welche Ausnahme hast Du noch ???