Hello, I'm having issues with a new layout in IE 6. The HTML is as follows: <div id="gsContainer"> <div id="gsLeftBorder"></div> <div id="gsRightBorder"></div> <div id="gsContent"> <div id="gsHeader">Heading</div> <div id="gsBox"> Some content </div> </div> </div> Code (markup): The CSS is as follows: #gsContainer { position: relative; width: 795px; height: 185px; margin: 0 0 15px 0; padding: 0px; } #gsLeftBorder { float: left; position: relative; margin: 0px; padding: 0px; width: 4px; background-image: url(/images/Left.gif); background-repeat: no-repeat; height:185px; } #gsRightBorder { position: relative; float: right; margin: 0px; padding: 0px; width: 4px; background-image: url(/images/GreenRight.gif); background-repeat: no-repeat; height:185px; } #gsContent { position: relative; height: 185px; margin-left: 4px; margin-right: 4px; width:779px; padding: 0px; } #gsHeader { position: relative; height: 25px; margin: 0px; padding: 6px 0 0 10px; width:769x; color: #fff; font-size: 14px; font-family: arial; font-weight: bold; background-image: url(/images/Header.gif); background-repeat: repeat-x; } #gsBox { position: relative; height: 129px; margin: 0px; padding: 25px 5px 0px 31px; width:743px; color: #000; font-size: 11px; font-family: verdana; background-image: url(/images/Back.gif); background-repeat: repeat-x; } Code (markup): The display looks fine when I test in IE 7, FF2, and Safari, with the content appearing with a clean "header" on top, and some inner content with borders on the left & right side. However, when viewing in IE6, the inner content (div "gsContent") is somehow too wide, and is pushed to the live after the "gsContainer" div. When I play with the widths, if I shave 8px of width off gsContent and its inner divs, then the alignment is fixed, but there is spacing between gsLeftBorder & gsContent as well as gsContent & gsRightBorder Any ideas how I can resolve this?