I have a floating right column on my page that moves with the sizing of the window. It works fine in IE8, FF and Rockmelt, but when I turn on compatibility mode it moves to the left and sticks to the right side of my center column and will collapse and disappear when the window is sized down. The code is below. Any ideas?
It's designed so that the center column has a fixed width of 665px and won't shrink down on window resizing, hence the extra out <div>s.
Thank you to everyone who has helped me with this page so far.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
background-position: top center;
A little bit clumsy your CSS. You have clear the float where you should not, but you did not clear the float when you should. Don't use margins if it is not necessary.
Think your document as being split into 3 rows: header, content and footer
Think your content as being split into 3 floated columns: left, center and right. You will need a 4th empty div there, to clear the float.