css - jquery ui button padding override -


html markup follows:

<button id="refresh"><img src="refresh.png" /></button> 

i creating button jquery ui button following code:

$("#refresh").button(); 

calling function produces following markup:

<button id="refresh" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false">     <span class="ui-button-text">         <img src="refresh.png">     </span> </button> 

this works fine. result button padding of .4em 1em; defined in jquery's css. (.ui-button-text-only .ui-button-text)

i have several buttons on page, , padding of them. however, 1 button in particular i'd have no padding. realize change css .ui-button-text-only , .ui-button-text screw other buttons using style, , them way are.

so i'm wondering if there's way override css just 1 button. took @ jquery's button docs doesn't appear allow passing of specific css in button options.

thanks in advance help!

you can add new class span within button after created.

$("#refresh").button(); $("#refresh").find('span.ui-button-text').addclass('yourclass'); 

Comments

Popular posts from this blog

django - How can I change user group without delete record -

java - Need to add SOAP security token -

java - EclipseLink JPA Object is not a known entity type -