Question

Is there any way to avoid the shifting effect you get when resizing the browser in Internet Explorer Compatibility Mode? It doesn’t happen in Chrome or Firefox. It also seems to work well in when Internet Explorer is NOT in Compatibility Mode.

Along with the shifting effect when resizing, sometimes the rows get out of sync a bit.

Any ideas?

Here’s the example (jsfiddle).

Answer 1

The issue is caused by your percentage widths. If you take 1% off of .right and .inner that should solve your problem. Live example: http://jsfiddle.net/Eq5s4/8/

.right{
    float: right;
    width: 49%; 
 }

.inner{
    position: relative; 
    width: 49%;  
}