Question

i want to let a div float right with a fixed size and the rest of the space needs to be left.
I have done this the flowing way:

HTML:

<div class="container">
<div id="rightCntr">
</div>
<div id="leftCntr">
</div>
</div>

CSS:

#leftCntr { 
float: none; /* not needed, just for clarification */
background: #e8f6fe;
/* the next props are meant to keep this block independent from the other floated one */
width: auto;
overflow: hidden; 
}

#rightCntr { float: right; width: 213px;}

this works great in Firefox and Chrome but in IE8 it goes all wrong. Example

Answer 1

Example jsBin: http://jsbin.com/ixebuf/1/ (tested on IE8, Fx)
(backgrounds are placed for testing purpose)

.container {
  width: 100%;
  overflow: hidden;
}
#rightCntr {
  float: right;
  width: 213px;
  background: gray;
}
#leftCntr {
   margin-right: 213px; 
   background: yellow;
}