Removing button padding?

Removing button padding?

Hi,

  I am trying to use a popup as a tooltip following the example here: http://demos.jquerymobile.com/1.4.5/popup/.

It works fine. Only thing is the i icon in the button seems to have some right padding as one could see in the demo. So, if in a line I need to show tooltip for two different texts the i icon for each has space and so appears visually a bit weird.

It will be good to have the icon as close to the text as possible. Is there a way?

I tried removing padding something like below but does not seem to work:

.ui-btn.my-tooltip-btn,

.ui-btn.my-tooltip-btn:hover,

.ui-btn.my-tooltip-btn:active {

    background: none;

    border: 0;

    padding-right: 0px;

    padding: 0px;

}

      

     .my-tooltip-btn  .ui-btn-inner {

    padding-right: 0px;

         padding: 0px;

}

Thanks in advance and regards