Question: IE 7 and IE 8 do not render 2 consequent divs with float:left on the same line if there is a table in one of the DIVs which is 100% width + non-zero margin:

````

<html>
<head>
<title>IE float left bug</title>
<style type="text/css">
.inttable
{
    width: 100%;
    margin: 9px;
}
.multicolumn 
{
    margin: 0px;
    border: 0px;
    padding: 0px;
    width:100%;
}
.column 
{
    margin: 0px;
    border: 0px;
    padding: 0px;
    float:left;
    display: inline;
}
</style>
</head>
<body>
<div class="multicolumn">
    <div class="column" style="width:50%;">
        <table class="inttable">
            <tr>
                <td>table1</td>
            </tr>
        </table>
    </div>
    <div class="column" style="width:50%;">
        column 2
    </div>
</div>
</body>
</html>

````

There is no such problem in FireFox, Opera, Chrome and Safari.

Does anyone know workaround for this IE bug?

Answer: 
As scunliffe mentioned in his comment making this html transitional or strict xhtml solves the issue.
The bug seems to be a 1px shift introduced by IE's terrible rendering engine.

The margin on the table inevitably pushes the floated div outward in IE, so the simplest working solution I've found is to add a negative left margin to the second column equal to your table's margin + 1 px. So in this case it'd be `margin-left:-19px;`

That's a bizarre and frustrating bug. Hope this solution works for you.