how can i stop images overlapping text on mobile/low.res devices

[vivapotenza]

Hi,

Im having troubles with alignment and formatting issues on ym site with an addon I installed (but i think this is more a coding error on my part as the addon is working perfectly, i just can get it placed correctly).

Ive installed the vbsponsor addon, and after a bit of googling and asking for help, i managed to get my banner images to show up correctly on my screen. This also appears correct to a lot of other people, however, when i login on my mobile, or lower the screen resolution, the images move further over to the right, and overlap the "threads & Posts" part of the forumhome screen. you can see 3 examples ive captured below:

my standard resolution of (1366x768):



Lowered to 1024x768:



and right down to 800x600:



As you can see, on a mobile device or similar the problem can be quite bad.

Any advice on how to solve this problem would be well appreciated as ive been at it for ages now. at present I am displaying the images using this code that was suggested I us on vbulletin.com (this is for just one specific image, and alongside the vbsposor software):

<div class="customsponsorloc">
<a target="_blank" title="Viva Potenza" href="vB.Sponsors/link.php?f=60">
<img src="/VbSponsor/VP-Shop-Icon.jpg">
</a>
</div>

And added to additional.css:

.customsponsorloc {
float:right;
margin-right: -100px;
margin-top: -40px;
}

Ive tried changing the margins to % instead of px, but its the same problem. As i say, any help would be greatly approciated as its really frustrating. the site can be found at www.vivapotenza.com.

Thanks in advance.