We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Icon Buttons

Hi Syncfusion team.
I have some icon buttons, and im try to add some margin between text and the icon.
here is my code:
HTML:


JS:
btnCheckAndFirm = document.getElementById('btnCheckAndFirm');
btnCheckAndFirm.innerHTML = "Firmar";
btnCheckAndFirm = new ej.buttons.Button();
btnCheckAndFirm.cssClass = "btnAction";
btnCheckAndFirm.iconCss = "e-icons iconSave";
btnCheckAndFirm.appendTo("#btnCheckAndFirm");
CSS:
.iconSave::before
{
content:url("../img/ic_signature_white_32.png");
padding-right: 30px;
}
thank you in advance
and greets from spain

1 Reply

SI Silambarasan I Syncfusion Team November 15, 2018 01:37 AM

Hi Miguel, 

Thank you for contacting Syncfusion support. 

We have checked your reported requirement and it can be achievable by overriding Button CSS styles as like in the below code example. 


CSS 

<style> 
     
      .iconSave::before 
     
        content:url("../img/ic_signature_white_32.png"); 
        //… 
     
       
      .e-btn .e-btn-icon.iconSave { 
        margin-right: 20px; 
      } 
       
    </style> 


Could you please check the above sample and get back to us if we misunderstood your requirement or need further assistance? 

Regards, 
Silambarasan 


Loader.
Live Chat Icon For mobile
Up arrow icon