CSS im IE funktioniert nicht richtig

[tagesgeldkonten]

Hallo liebe Cssler.

Ich habe folgendes Problem auf der Seite Tagesgeldkonten
Im Firefox alles kein Problem, nur im IE ist folgendes Problem:
bis auf die Listen, die der IE auch verschoben anzeigt, verschiebt der IE das ganze Layout wenn ich das Browserfenster kleiner als ca 1100px oder 1200px mache. Bei größerer Auflösung ist die Seite auch ok, nur bei der Größe schiebt IE die Seite einfach runter und so wird die Seite bei niedrigerer Auflösung nicht richtig angezeigt.
Ich weiß nicht wodrans liegen kann.
Hier mal meine CSS Datei:

/* commented backslash hides from ie5mac \*/
html{
height:100%;
width:100%;
margin:0;
padding:0;

}
html>body #outer{
height:auto;
} /*for mozilla as IE treats height as min-height anyway*/

/* end hack */
html,body {
padding:0px;
margin:0px;
background-color: #ffffff;
font-size: 11px;
font-family: verdana, sans-serif;

}
body{
margin-top: 0pt;
margin-right: 0pt;
margin-bottom: 0pt;
margin-left: 0pt;
padding-top: 0pt;
padding-right: 0pt;
padding-bottom: 0pt;
padding-left: 0pt;
text-align: left;
min-width:1024px;/* for mozilla*/
background-color: #ffffff;
height:100%;
width:100%;

}
#wrapper {
height:100%;
width:100%;
}
#outer{
height:99.9%;
min-height:100%;
margin:auto;
width:1124px;
text-align:left;
position:relative;
overflow:visible;
left:-20px
}
#outer-left {

position:relative;/*ie needs this to show float */
top:190px;
float:left;
left:5px;
}

/* mac hide \*/
* html #outer{
width:1024px
}
/* end hide*/

html>body #outer{
height:auto;
} /*for mozilla as IE treats height as min-height anyway*/

#inner{
width:90%;
padding-top:190px;/*needed to make room for header*/

}

#header{
position:absolute;
top:5px;
left:62px;
width:1124px;
height:98px;
z-index:74;
background: url(images/tagesgeld.jpg) no-repeat left top;
}

#ajaxmenu{
position:absolute;
top:120px;
width:1124px;
left:-92px;
height:50px;
z-index:65;
background: url(images/menubar-bg.png)
}

#logo {
position:absolute;
top:0px;
left:0px;
width:1124px;
height:98px;

}

/* mac hide \*/
* html #outer, * html #header {width:780px}
/* end hide*/
#footer {
color: #999;
width:900px;
clear:both;
height:70px;
text-align:center;
left:-45px;
margin: auto;
bottom:0px;
position: absolute;
}
#footer a {
color: #191970;
}
#footer a:hover{
background-color: #9f0000;
color: #ffffff;

}
#footer p {
margin-top: 58px;
padding: 8px;
}
#footer p a {
text-decoration: none;
color: #ffffff;
}
#footer p a:hover {
background-color: #9f0000;
color: #ffffff;
}
* html #footer{
margin-bottom:-1px
}/* ie rounding bug*/

/* mac hide \*/
* html #footer {
/*only ie gets this style*/
height:82px;
/* for ie*/
}
/* end hide*/

div,p {
margin-top:0px;
font-size: 11px;
font-family: verdana, sans-serif;
}/*clear top margin for mozilla*/

#right {
width:256px;
float:right;
z-index: 55;
}
#right-inner {
width: 300px;
padding-left: 9px;
text-align: left;
background-color: #f5f5f5;
border-left: thin solid #191970 ;
border-right: thin solid #191970 ;
border-top: thin solid #191970 ;
border-bottom: thin solid #191970 ;
left:300px;
}
#right-inner2 {
width: 300px;
padding-left: 9px;
text-align: left;
top:620px;
background-color: #f5f5f5;
border-left: thin solid #191970 ;
border-right: thin solid #191970 ;
border-top: thin solid #191970 ;
border-bottom: thin solid #191970 ;
left:350px;
}
#right-inner2 h2 {
font-size: 15px;
color: #191970;
text-decoration: underline;
}
#right-inner3 {
width: 300px;
padding-left: 9px;
text-align: left;
top:920px;
background-color: #f5f5f5;
border-left: thin solid #191970 ;
border-right: thin solid #191970 ;
border-top: thin solid #191970 ;
border-bottom: thin solid #191970 ;
left:350px;
}
#content a, #sidebar3 a {
color: #191970;
}

#right-inner4 {
width: 300px;
padding-left: 9px;
text-align: left;
top:920px;
background-color: #f5f5f5;
border-left: thin solid #191970 ;
border-right: thin solid #191970 ;
border-top: thin solid #191970 ;
border-bottom: thin solid #191970 ;
left:350px;
}
#content a, #sidebar4 a {
color: #191970;
}

#right-inner4 h2 {
font-size: 15px;
color: #191970;
text-decoration: underline;
}
#right-inner5 {
width: 300px;
padding-left: 9px;
text-align: left;
top:620px;
background-color: #f5f5f5;
border-left: thin solid #191970 ;
border-right: thin solid #191970 ;
border-top: thin solid #191970 ;
border-bottom: thin solid #191970 ;
left:350px;
}
#right-inner5 h2 {
font-size: 15px;
color: #191970;
text-decoration: underline;
}
#content a, #sidebar5 a {
color: #191970;
}
#content ul li, #sidebar5 {
list-style-image: url(images/bullet_11x8.gif);
font-size: 110%;
line-height: 20px;
margin-top: 1pt;
margin-right: 0pt;
margin-bottom: 0pt;
margin-left: 0pt;
padding-top: 2pt;
padding-right: 0pt;
padding-bottom: 3pt;
padding-left: 0pt;
}
#right-inner h2 {
font-size: 15px;
color: #191970;
text-decoration: underline;
}

#left {
position:relative;/*ie needs this to show float */
width:650px;
float:left;
padding-left: 15px;
left:65px;
}

#left2 {
position:relative;/*ie needs this to show float */
width:650px;
float:left;
padding-left: 15px;
z-index: 56;
left:-35px;
}

#left-inner {
padding-left: 19px;
padding-right: 19px;
text-align: left;
background-color: #f5f5f5;
border-left: thin solid #191970 ;
border-right: thin solid #191970 ;
border-top: thin solid #191970 ;
border-bottom: thin solid #191970 ;
float:center;
}
#left-inner2 {
padding-left: 19px;
padding-right: 19px;
text-align: left;
background-color: #f5f5f5;
border-left: thin solid #191970 ;
border-right: thin solid #191970 ;
border-top: thin solid #191970 ;
border-bottom: thin solid #191970 ;

}

#clearfooter {
width:100%;
height:82px;
clear:both;
} /* to clear footer */

html>body #minHeight{
float:left;
width:0px;
height:100%;
margin-bottom:-82px;
} /*safari wrapper */
#content {
z-index: 300;
padding-top: 7px;
}


#content h2 {
text-align: justify ;
font-size: 15px;
color: #9f0000;
background: url(images/bullet4.png) no-repeat left top;
padding-left: 26px;
line-height: 16px;
position: relative;
z-index: 999;
text-decoration: underline;
}

#content2 {
z-index: 300;
padding-top: 7px;
}


#content2 h2 {
text-align: justify ;
font-size: 15px;
color: #9f0000;
background: url(images/bullet4.png) no-repeat left top;
padding-left: 26px;
line-height: 16px;
position: relative;
z-index: 999;
text-decoration: underline;
}
h3#post- {
font-size: 12px;
color: #191970;
background: url() no-repeat left top;
padding-left: 0px;
}

#content p {
font-size: 12px;
color: #444444;
line-height: 18px;

}

#content p a {
color: #191970;
}
#content p a:hover {
background-color: #9f0000;
color: #ffffff;
}

#content ul li{
list-style-image: url(images/bullet_11x8.gif);
font-size: 110%;
line-height: 20px;
margin-top: 1pt;
margin-right: 0pt;
margin-bottom: 0pt;
margin-left: 0pt;
padding-top: 2pt;
padding-right: 0pt;
padding-bottom: 3pt;
padding-left: 0pt;
}

#content a, #sidebar a
{
color: #191970;
}
#content ul li, #sidebar
{
list-style-image: url(images/bullet_11x8.gif);
font-size: 110%;
line-height: 20px;
margin-top: 1pt;
margin-right: 0pt;
margin-bottom: 0pt;
margin-left: 0pt;
padding-top: 2pt;
padding-right: 0pt;
padding-bottom: 3pt;
padding-left: 0pt;
}
#content #sidebar2 a:hover
{
background-color: #9f0000;
color: #ffffff;
}
#content a, #sidebar2 a
{
color: #191970;
}
#content ul li, #sidebar2
{
list-style-image: url(images/bullet_11x8.gif);
font-size: 110%;
line-height: 20px;
margin-top: 1pt;
margin-right: 0pt;
margin-bottom: 0pt;
margin-left: 0pt;
padding-top: 2pt;
padding-right: 0pt;
padding-bottom: 3pt;
padding-left: 0pt;
}
#content #sidebar2 a:hover
{
background-color: #9f0000;
color: #ffffff;
}
/* WP-Table CSS File v1.35 */

#table {

font: Icon;
border: 1px Solid ThreeDShadow;
background: Window;
color: Window Text;
border-collapse: collapse;
font-size: 11px;
font-family: verdana, sans-serif;
}

/* header row*/
#table th {

padding: 2px 5px;
border: 1px solid;
border-color: black black black black;
cursor: default;
background: lightslategray;
color: #ffffff;

}

/* normal row*/
#table td {
font-size: 11px;
font-family: verdana, sans-serif;
padding: 3px;
}

/* alternative rwo */
#table tr.alt {
font-size: 11px;
font-family: verdana, sans-serif;
background-color: #dedede;

}
.ext { text-decoration: none;
}

Vielleicht liegts am #outer mit festgelegter Größe 1124px?
Wenn mir jemand helfen kann oder einen Tipp hat, das wäre wahnisnnig super, denn ich weiß nicht weiter.
vielen Dank und viele Grüße

[sejuma]

Zunächst solltest du diese 146 Fehler bereinigen.
Somit kann ausgeschlossen werden, dass es einer von denen ist.
Zum zweiten sind deine vielen relativen und absoluten Positionierungen in aller Regel überflüssig.
Positioniere deshalb generell nur mit float- und margin-Angaben.
Den IE6-Doubled-Float-Matrgin-Bug kannst du damit beheben. Somit sollten ziemlich alle Spezialangaben für den Internet-Explorer überflüssig werden.

Generell: Entweder musst du mit den Nachteilen eines Baukasten-Templates leben, oder HTML und CSS lernen.

[tagesgeldkonten]

danke für die antwort, die html fehler werd ich schon noch beheben, und mit css kenn ich mich eben nicht soo gut aus, dass ich es selber beheben könnte, aber eigentlich kanns ja nur am floaten liegen...dass es aber ein ie und css problem ist zeigt ja dass es im firefox ohne probleme geht.
falls es weitere tips gibt, immer her damit
grüße

[sejuma]

Es kann natürlich auch an den CSS-Fehlern liegen oder eben an einer unterschiedlichen Browserinterpretation.
Deshalb ist es wichtig, die Seite zunächst valide zu machen. Ansonsten reagieren die Browser mit gewissen "Toleranzen" und letztlich weiß man dann eben nicht, wo die konkrete Ursache liegt.
Wenn also die Seite valide ist, werde ich mir sie gerne nochmal ansehen.

Lass zunächst auch mal sämtliche Spezialangaben für den IE weg. Dann sieht man, ob sie überhaupt erforderlich sind.

[tagesgeldkonten]

so die seite ist nun xhtml valide laut w3c und trotzdem das gleiche problem, vermutlich die floating geschichte...aber nach vielen recherchen ist ie wirklich ein css hasser
vielleicht kann ja jemand nochmal drüberschauen was das problem sein kann.
danke und vg

[tagesgeldkonten]

ok hab den fehler nun endlich gefunden, zum glück gibt es so etwas wie einen web developer für den ie, und der hatte gezeigt dass es im template ein minHeight gab womit ie7 nicht zurechtkam. habs gelöscht und nun ist alles io mit der Tagesgeldkonto Vergleich
danke für die hilfe und noch einen schönen Sonntag