Okay, so I'm not entirely sure on your question, but I did find the problem with your code causing the white space.
The problem:
The white space was caused by the script:
http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js
What it's doing is, it's creating two different span tags inside the active links around the images. And that's the white space!
<span class="ui-btn-inner"><span class="ui-btn-text"><img style="width:100%; height:100%" src="icon2.png"></span></span>
You can view this for yourself by right-clicking on the webpage in Chrome and clicking "Inspect Element." These spans are causing the image to appear to have a white space around it. (I assume the active link is of the span, not the link, so it appears the image itself has white space.)
The solution:
You have to remove http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js
if you want this to display as intended on non-mobile devices. There are various ways to try and detect whether or not a mobile browser is being used.
If you must run that script, a possible workaround may be to have a div with a background color that matches the images. It may be possible to manipulate the spans with CSS, though having bother scripts running may cause problems (and possibly not even work as intended) as well.
StackOverflow question regarding mobile-only script loading.