[CSS] Extreme Layout verschiebung FF / IE

[Bart]

Ich kämpe gerde mit meinen CSS Layout versuch.

Leider habe ich eine Extrem Verschiebung im Internet Explorer von den Inhalten.

Aussehen sollte es in etwa so:


Was auch Im FF richtig dargestellt wird. Der Internet Explorer jedoch verschiebt den Inhalt ab Infobox bis unterkante von den Menue.




Die Css definition:

body {
  background-image: url(../Grafik/raster.gif);
}

#Seite {
  width:980px;
  margin:auto;
}

#Logo {
  height: 115px;
  margin: 10px;
  width: 980;
  background-color: #000000;
  border:2px solid #A92371;
  background: url(../Grafik/balken.jpg) repeat;
}

#News {
  color: #FFFFFF;
  margin: 10px;
  height: 20px;
  background-color: #000000;
  border:2px solid #A92371;
}
#leiste {
  margin-top: 10px;
  margin: 10px;
  height: 60px;
  background-color: #000000;
  border:2px solid #A92371;
  background: url(../grafik/Balken-Logo-Repeat.png) repeat;
}

#Inhalt {
 z-index:0
  height: 460px;
  margin: 0 170px;
  background-color: #CCCCCC;
  border:2px solid #A92371;
}

/*****************************************/
/*                 Partner Box             */
/***************************************/
#rechts1 {
 z-index:4;
 margin: 10px;
  margin-top:-25px;
  float:right;
  position: relative;
  width: 140px;
  height: 245px;
  background-color: #FFFFFF;
  border:2px solid #A92371;
  font-size: small;
}

#Rechts1 a{
  color:#CCCCCC;
  text-decoration:none;
  margin:auto;
  display:block;
  width:100px;
  height:15px;
  border:1px solid #d5e7ec;
  text-align:center;
}

#Rechts1 a:hover{
  color:#FFFFFF;
}

/*****************************************/
/*                 Startseite Boxen        */
/***************************************/
#infobox {
  margin: 10px 10% 0 10px;
  display:block;
  width: 95%;
  height: 220px;
  background-color: #FFFFFF;
  border:2px solid #A92371;
  text-align:center;
  }

#mobile {

  margin: 10px 15px 0 10px;
  width: 95%px;
  height: 100px;
  border:2px solid #A92371;
  background-color: #FFFFFF;
  text-align:center;
}

/*****************************************/
/*                 Menue Buttons             */
/***************************************/
#button {
 z-index: 3;
  float:left;
  margin: -25px 10% 0 10px;
  display:inline;
  width: 135px;
  height:235px;
  padding: 10 5 1em 5;
  border:1px solid #d5e7ec;
  text-align:center;
  color:#CCCCCC;
  background-color: #666666;
  border-left: 2px solid #A92371;
  border-right: 2px solid #A92371;
  border-top: 2px solid #A92371;
  border-bottom: 2px solid #A92371;
  text-decoration:none;
  font: italic small-caps none 1em/1.5em arial, sans-serif;
  font-size:small;    
    }

#button ul {
        list-style: none;
        margin: 0;
        padding: 0;
        border: none;
        }
        
    #button li {
        border-bottom: 1px solid #90bade;
        margin: 0;
        }
        
#button li a {
        display: block;
        padding: 5px 5px 5px 0.5em;
        border-left: 10px solid #8F0656;
        border-right: 10px solid #E542A1;
        background-color: #AA116A;
        color: #fff;
        text-decoration: none;
        width: 100%;
        font: italic small-caps bold 1em/1.5em arial, sans-serif;
        font-size:small;
        }

    html>body #button li a {
        width: auto;
        }

    #button li a:hover {
        border-left: 10px solid #E542A1;
        border-right: 10px solid #8F0656;
        background-color: #AA116A;
        color: white;
        text-decoration: blink;
        font: italic small-caps bold 1em/1.5em arial, sans-serif;
        } 

Was ist falsch das der IE es so extrem verschiebt ?
Weil bisher hatte ich zwischen FF und IE eigentlich nur kleinere Position Verschiebungen.

Getestet auf
FF 3.xx
IE 6, 7(8er emuliert) und 8(beta)

[jahlives]

Forbidden
You don't have permission to access /bild.php/2,4352,33U9CJ.jpg on this server.

Die Links funzen ned!

[Bart]

Ja sorry, free Picture anbieter :/ habe es korregiert.

[Kropff]

hab mir jetzt die css-anweisungen nicht genau angesehen aber gibt den weissen blöcken mal ein

height: 1px; 

und ggf. ein

display: inline; 

oder ein

margin-left: -3px; 

oder dem grauen. da musst du ein wenig herumspielen. und natürlich als ie-hack einbauen. vielleicht liegts es auch an einem unsauberen flaten. eine online-fassung wäre da sicher hilfreich für uns.

peter