ie9 hack for background-size property?

hi all,

ie9 won’t play nicely with my code:
#wrapper {
background-image:url( … );
background-size:100% auto;
background-position:top center;

is there a hack for this? if so what is it and how do i implement? also, since the header is a fixed height i suspect i’ll also have to … somehow hack that to resize appropriately too?

please be patiently explicit, i’m extremely hack-challenged… what you see there has the header image as a placed image. the wrapper and footer images are placed using the above declaration.

i did a google search and also searched the forums here. all i could find was something about a filter which i found even more baffling than hacking.

i fit matters, it’s a wordpress site. i’m using weaver II theme (free version) and coding custom CSS in the appropriate theme-customization provided entry area.
thanks! the declaration seems to work fine in various versions of safari, firefox and chrome on mac and pc, and my android tablet/browser … just not on ie9.


background-size normally works fine on IE9, and seems to be working on your site, although the inspector shows it crossed out. Perhaps something is overriding it.

thanks for your response ralph. :slight_smile:

it’s not working in my ie9. just to make sure we’re talking about the same background, the water pattern is the page background.

the backgrounds in question are the wrapper and footer. the wrapper background is the tint with fading edges; the footer background is a top border with an opaque white “patch” which fits over the center. when i size the browser window down, the edge treatment gets cropped off.

i looked at it in FF/firebug (on the mac) and don’t even see background-size there, much less crossed out ??? quizzical look

Yep, those are defiantly working in IE9 for me. Make sure you aren’t in IE8 or IE7 mode, for some reason.

i looked at it in FF/firebug (on the mac) and don’t even see background-size there, much less crossed out ??? quizzical look

Sure shows up fine in Firebug for me (see attached). They are crossed out in the IE dev tools, for some reason, but they are still working. :-/ (IE is looney anyway … what can one say?)

i didn’t know one could be in ie7 or ie8 mode … can you please direct me to where i determine that?

To see the mode in IE8 (IE9 is probably the same or similar):
In the top of IE9, click the “Tools” menu item.
Near the bottom of the list, click “Developer Tools”.
At the top of the Dev Tools window, the right-most item tells the mode. Click it to change the mode.

thanks ronpat! i’m in ie9…