Is there an alternative to the CSS background-size property that works on mobile devices?

In CSS3, setting background-size on the background image of开发者_JAVA百科 a button stretches it to the button height and width.

Is there an alternative to background-size, since my targets are mobile devices, and some don’t support it. I dont want to specify anything in px or em.

See http://css-tricks.com/perfect-full-page-background-image/ - It details a way to do this without using background-size.

No, not really.

There’s background-repeat, which takes one background image, and repeats it along the x-axis and/or the y-axis. Depending on what you want your button to look like, that might work: see e.g. http://sophie-g.net/jobs/css/e_buttons.htm

But there isn’t anything that has the same effect as background-size. That’s why background-size was introduced.

No, there isn't.

It's a new property introduced on CSS3. Many browsers already know it, but for those that doesn't, you have two main options:

• Gracefully degrade, with something like Modernizr. I think it's the better and easy approach.
• Use diferent image sizes and chose each one based on the button size (using vanilla JavaScript, jQuery, Motools, etc).

You can try this for IE8. My project was in MVC4 and I tried this and worked for me (IE+Chrome)

div class="logoDiv">  </div>  

and in css you define your class as

.logoDiv {  
        max-width: 100%;
        height: 100px; /*(My Image height was 100px .....You please define yours)*/
        background: url("../Images/logo.jpg") no-repeat;
        background-size: cover; 
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../Images/.logo.jpg.jpg', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../Images/logo.jpg', sizingMethod='scale')";   
    }