CODEWITHSUNDEEP
htmlsencha-touchextjssencha-touch-2
thiagocfb
thiagocfb

Reputation: 487

How to make the button image fill it?

I'm trying to apply an image to a xtype='button' however when i do it my button looks like this

enter image description here

How can i make this image fill this button ?

Code (sencha touch 2 js):

        {
            xtype: 'button',
            width: 140,
            height: 60,
            margin: 10,
            right: 20,  

            text: 'Enter',
            html: '<img src="resources/images/Dbutton.png"/>'
        }

Upvotes: 0

Views: 9868

Answers (2)

beuki
beuki

Reputation: 90

to work on all browsers, change the html to 

    <input type='image' src='filename.png' width='25' height='25' name='whatever' value='submit' />

this uses the image as a submit button.

Upvotes: 3

Spudley
Spudley

Reputation: 168685

If the image is a background image on the button, then use the CSS property background-size.

.mybutton {
    background-size: cover;
}

Note that this won't work in IE8 or earlier. You'd need to use a polyfill javascript if you want IE8 support. Try this one: https://github.com/louisremi/jquery.backgroundSize.js

Hope that helps.

Upvotes: 2

Related Questions