IE formatting off

HTML & CSS
1

When viewing this page in IE:
http://snipurl.com/20znqyr

…the content is pushing out of the DIV - I have dug through code and can’t seem to find it. If someone could be my second pair of eyes it would be great, I would appreciate it.

  • had to use a SNIPURL because clients check back links and don’t like when I post their sites in a help forum, I’ve found :slight_smile:
2

Nm - found it, I had an IE7 emulator in the header area causing the problem

3

The root of the problem is that the width is being forced by the Google + code. Specifically, the 450px width declared in the inline style of the nested div and the iframe. They should be no more than 220px for the space available.

<!-- Place this tag where you want the +1 button to render -->
<DIV style="MARGIN: auto; WIDTH: 150px" align=center>
<DIV style="BORDER-BOTTOM-STYLE: none; PADDING-BOTTOM: 0px; LINE-HEIGHT: normal; TEXT-INDENT: 0px; MARGIN: 0px; BORDER-LEFT-STYLE: none; PADDING-LEFT: 0px; WIDTH: 450px; PADDING-RIGHT: 0px; DISPLAY: inline-block; BORDER-TOP-STYLE: none; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: none; HEIGHT: 24px; BORDER-RIGHT-STYLE: none; FONT-SIZE: 1px; VERTICAL-ALIGN: baseline; PADDING-TOP: 0px; cssFloat: none" id=___plusone_0><IFRAME style="POSITION: static; BORDER-BOTTOM-STYLE: none; MARGIN: 0px; BORDER-LEFT-STYLE: none; WIDTH: 450px; BORDER-TOP-STYLE: none; HEIGHT: 24px; VISIBILITY: visible; BORDER-RIGHT-STYLE: none; TOP: 0px; LEFT: 0px" id=I1_1322722044519 title=+1 tabIndex=-1 marginHeight=0 src="https://plusone.google.com/_/+1/fastbutton?url=http%3A%2F%2Fwww.trueblissgiftbaskets.com%2Fitem_619%2FHoliday-Finer-Things-Holiday-Gourmet-Gift-Basket.htm&amp;size=standard&amp;count=true&amp;annotation=inline&amp;hl=en-US&amp;jsh=m%3B%2F_%2Fapps-static%2F_%2Fjs%2Fwidget%2F__features__%2Frt%3Dj%2Fver%3DvcMyHjgxfFU.en_GB.%2Fsv%3D1%2Fam%3D!TxaHJQ_ELSaIORy5WA%2Fd%3D1%2F#id=I1_1322722044519&amp;parent=http%3A%2F%2Fwww.trueblissgiftbaskets.com&amp;rpctoken=651443562&amp;_methods=onPlusOne%2C_ready%2C_close%2C_open%2C_resizeMe" frameBorder=0 width="100%" allowTransparency name=I1_1322722044519 marginWidth=0 scrolling=no></IFRAME></DIV></DIV>

As you’ve found, IE8/9 will render the element at this width when the IE7 X-UA-Compatible meta is present. Presumably the meta was added for a reason so hopefully removing it won’t break your site elsewhere.

The page also has validation errors that would be worth addressing.