开发者

CSS 3 background-size not working on IE9

开发者 https://www.devze.com 2023-03-21 19:32 出处：网络

background-image:url(yellow.jpg); background-size:180px 180px; background-repeat:no-repeat; The above mentioned css works perfect on chrome but ie9 is unable to scale images + displa开发者_如何学编程

相关专题：css

background-image:url(yellow.jpg); background-size:180px 180px; background-repeat:no-repeat;

The above mentioned css works perfect on chrome but ie9 is unable to scale images + displa开发者_如何学编程y images correctly

Are you sure your IE runs in IE9 mode? Your code works with any image I tried.

(F12 to open developer window)

I think the issue is based on scaling the image to the proper size. Have you tried this?

background:url(yellow.jpg) 0 0 / 180px 180px no-repeat fixed;

Basically what it does is:

background:background-image background-position(top) background-position(left) / background-size(height) background-size(width) background-repeat background-attachment;

That should work with IE9 (and all other modern browsers out there) ...

IE will open a page without the doctype tag in quirks mode in which background-size does nothing. To force IE to open the page in IE9 mode add <!doctype html> at the top of each html document.