Finde den Fehler nicht: XHTML Strict

[balufreak]

Hallo Leute! Ich habe eine Seite, und zwar http://www.cube-night.ch

Diese sieht im FF perfekt aus, aber im IE hat es rechts noch so ein kleinen streifen, wo das logo nicht ganz rüber geht. Könnt ihr mir sagen, wass da falsch ist? ich habs auch schon validieren lassen und es ist gültig bis auf die <p> und <ul> tags. aber das kann auch nichts damit zu tun haben.

Desweiteren, könnte mir jemand von Safari ein Screenshot machen?

 

[Darii]

Der IE berechnet vermutlich irgendeinen Wert falsch.

Mit

div.width { 920px; }

klappt es im IE(aber nur da)

 

[2nd]

Hier ist der Screen - rechts und unten Scrollbalken:

Safari Screen

Noch was zum Markup: Wenn schon unbedingt Strict und XHTML - dann gehört da meiner Meinung nach auch semantisch korrektes HTML dazu. Dein Markup ist jedoch ziemliches DIVitis Chaos, gemixt mit Layoutplatzhaltern aus den PräCSS Zeiten und anderen Kuriositäten (z. B. eine hochskalierte Grafik von 800 auf 940px -> Logo):

z. B. hier:

<div class="width">
    <div id="header">
        <div class="text">

und hier die &nbsp;:

&nbsp;<!--<a href="index.php?cat=8">Impressum</a>&nbsp;&nbsp;&nbsp;//&nbsp;&nbsp;&nbsp;<a href="index.php?cat=9">Quellen</a>-->

Da sollstest Du nochmal einiges überarbeiten. Auch im CSS File:

#header .text{
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    height: auto;
    border: 0px solid;
}

Da reicht ein:

#header .text{
    padding: 0;
    margin: 0;
    height: auto;
    border: 0;
}

Auch ist mir nicht ganz klar, warum Du das Headerbild in einen ExtraDIV tust? Ferner sollstes Du das Menu als Liste mit Inline Elementen auszeichnen.

Das alles ist mir auf den ersten Blick aufgefallen. Wenn schon XHTML und strict dann bitte richtig Ich hoffe, Du verzeihst mir!

2nd

 

[2nd]

Ich nochmal: Du hast im Footer ein Padding von 10px eingebaut, das zur Breite von 940px dazu addiert wird - deswegen gibt es die Lücke im IE:

#footer .text{
    padding: 2px 10px 2px 2px;
    margin: 0px 0px 0px 0px;
	width: 100%;
}

Nimm das raus und die Lücke ist weg:

#footer .text{
	width: 100%;
}

Und tu ganz oben in die CSS folgendes:

* {
	margin: 0;
	padding: 0;
}

Und danach würde ich alle margins und paddings in der CSS löschen und neu strukturieren. Beide Dokumente (HTML und CSS) sind echtes Superchaos, sorry. Im Prinzip reicht ein DIV, nämlich das .width, den Rest kannst Du ohne DIVS darstellen, ULs, H1, H2 und p sind Deine Freunde

2nd