IE - DIV hat ungewollten mindestabstand zu anderem DIV

[Stefan]

Hi,

Ich habe ein zweispaltiges Layout bei dem Link Inhalt und rechts das Menü ist. Das habe ich so gelößt dass das linke div links floatet und das rechte menü-div ein entsprechendes margin-left hat. Jetzt habe ich aber das Problem dass er, egal wie klein ich das margin-left mache, das Menü mit einem Mindestab von 3 Pixeln zum hauptdiv darstellt. Das ist auch nicht der berühmte drei-pixel-IE-bug weil er ja nicht einfach 3 pixel auf das bestehende margin zurechnet, sondern einfach immer mindestens 3 pixel abstand hält auch wenn ich nur 1px margin-left angebe. Ich habe auch nicht ausversehen ein margin gesetzt. Hier der Code:

HTML:

<div id="wrapper">  
  
 <div id="content">  
  blah  
 </div>  
  
 <div id="menu">  
  bleh  
 </div>  
  
</div>

CSS:

#wrapper {  
 width: 800px;  
 margin: 0px auto 0px auto;  
 text-align: left;  
}  
  
#content {  
 width: 557px;  
 float: left;  
 padding: 26px 28px;  
 background-color: #f6f6f6;  
  
 voice-family: "\"}\"";  
 voice-family:inherit;  
 width: 501px;  
}  
  
body>#content { width: 501px; }  
  
#menu {  
 width: 239px;  
 margin-left: 558px;  
 background-color: #ecedf4;  
}  
  
/* Hide from IE5-mac. Only IE-win sees this. \*/  
  
* html #menu {  
 margin-left: 1px;  
}  
  
/* End hide from IE5/mac */

Das Problem hatt ich jetzt zum ersten mal...

Stefan

[ìtte]

Hi,

hallo

Jetzt habe ich aber das Problem dass er, egal wie klein ich das margin-left mache, das Menü mit einem Mindestab von 3 Pixeln zum hauptdiv darstellt.

sollte kein problem sein, wenn du dem menu div auch noch die eigenschaft float:left gibst!!!!

CSS:

#wrapper {

width: 800px;
margin: 0px auto 0px auto;
text-align: left;
}

#content {
width: 557px;
float: left;
padding: 26px 28px;
background-color: #f6f6f6;

voice-family: ""}"";
voice-family:inherit;
width: 501px;
}

body>#content { width: 501px; }

#menu {
width: 239px;
margin-left: 558px;

float: left;

background-color: #ecedf4;
}

/* Hide from IE5-mac. Only IE-win sees this. */

• html #menu {
  margin-left: 1px;
  }

/* End hide from IE5/mac */

das ganze würde dann ungefähr so ausschaun:  
<style>  
#wrapper {  
 width: 800px;  
 height:300px;  
 margin: 0px auto 0px auto;  
 text-align: left;  
 background-color: #BBBBBB;  
}  
  
#content {  
 width: 557px;  
 float: left;  
 padding: 26px 28px;  
 background-color: #888888;  
 width: 501px;  
  margin-right:0px;  
}  
  
#menu {  
float:left;  
 width: 239px;  
 margin-left: 0px;  
 background-color: #444444;  
}  
</style>  
<div id="wrapper">  
  
 <div id="content">  
  content  
 </div>  
  
 <div id="menu">  
  menu  
 </div>  
  
</div>  
  
sorry das es so einfach war