XF 1.4 How To Center An HTML Banner On Mobile

[MQK8]

Hi folks:

I can't seem to find the answer or the correct code to make this work so thought I'd turn to the community.

I have an 728x90 HTML banner in the ad above breadcrumb templet, everything is good on laptop and desktop but on mobile devices the banner is cut off on the right side and not showing.

What is the proper code to put in extracss if that's what I do and also should I keep the banner at 728x90 or should I make it smaller or does it matter? Would greatly appreciate any help on this .

 

[Paul B]

Centering it won't help if it is too wide for the screen.

The links in my signature explain how to implement responsive design and AdSense.

 

[MQK8]

Thanks Brogan for the info, just now getting a chance to respond back on this., I want to thank @BassMan for giving me this code that seems to have taken care of the problem, just in case anyone else has this question paste this code under your html link.

<style type="text/css">
.banner1 {
width: 728px;
height: 90px;
border: 0;
}
<xen:if is="@enableResponsive">
@media (max-widthmaxResponsiveWideWidth) {
.Responsive .banner1 {
width: 100%;
height: 100%;
border: 0;
}
}
</xen:if>
</style>

 

[Martok]

Although that code will work, if you are resizing an Adsense banner in this way, you are violating the Adsense t&c's. For Adsense, you really need to show different banners at different browser widths. As @Brogan said, there's a link in his signature about this.

 

[MQK8]

Although that code will work, if you are resizing an Adsense banner in this way, you are violating the Adsense t&c's. For Adsense, you really need to show different banners at different browser widths. As @Brogan said, there's a link in his signature about this.

Hi Martok,
This isn't a adsense banner, just a banner that I was having trouble with getting to fit right on the forum, thanks for the heads up

 

[Paul B]

Rather than resize it, which may not give great results, why not apply different sized banners based on the width?