Possible padding around custom icon image?

[JaneCopeland1]

I'm using a custom image for a widget in the Launchpad app. The image is the same size as the esri standard images - 50x50px but mine seems to have some sort of padding around it. The image doesn't fill the whole space of the button as the standard esri images do. I've followed the information in other threads to make the images larger. I can get the image larger but my image still doesn't fill the whole available space. I've included a picture of what it looks like. Is there a way to make the image fill the whole button?

[RobertScheitlin__GISP]

Jane,

   Even the esri icons have a certain padding. Does your image have a area around it that is transparent already so that it displays as a circle?

[JaneCopeland1]

Robert - thanks for the quick reply. The only transparency is on the corners. The image itself fills the canvas.

[RobertScheitlin__GISP]

Jane,

  It appears to me if you measure the square esri default icons and compare it to your round icons width and height, you will see that they have an equal amount of padding and it is acting like it should.

[JaneCopeland1]

Robert - is there a way to shrink the padding around just that image?

By the way - congratulations on your award at the conference in San Diego. Much deserved. I used to work with the Flex app and you were a great help in that community as well.

[RobertScheitlin__GISP · Accepted solution]

Jane,

   You would have to increase the img height and width and remove or make the margin-top smaller.

So something like add this new css rule to the end of the common.css file in the launchpad theme.

.claro .jimu-anchorbar-iconitem .icon-item .icon {
  width: 30px !important;
  height: 30px !important;
  margin-top: 5px !important;
}‍‍‍‍‍‍‍‍‍‍

[JaneCopeland1]

That works. Thanks.