XF 1.2 ad_header and the site logo

[Myke623]

I'm having difficulty getting my site logo and my ad_header (with adsense code) to co-exist happily together. I'm employing the asynchronous adsense update as prescribed in Brogan's Responsive AdSense resource, and that is working as expected - I get the correct sized ad based on the browser width upon a reload.

However, due to my fixed width of the logo I find that if I resize the browser and reduce the width such that the ad and logo collide, the logo will jump beneath the ad and an ugly overlaps with the main content ensues.

Before:


After:



The breadcrumb/nav bar is hidden, but you can see the right-facing arrows just floating in place.

Is there a way to prevent the overlapping? I wouldn't mind if the content below just got shoved down accordingly, but just wondering if there's a more elegant solution, or "preferred practice" to having a logo alongside an Ad in the header space when using a responsive design?

 

[Paul B]

Unfortunately there is not much you can do about this.
A page refresh will fix it as a smaller ad will be served, but this doesn't happen dynamically.

Anything which increases the header space compared to what is set in SPs will have a detrimental effect on the style, especially the breadcrumbs and nav bar.

I don't have an ad in the header for this reason.

 

[Myke623]

So which locations are most compatible, or friendly toward, landscape-style ads in a responsive design?

 

[Paul B]

I use almost all ad templates but the ad_header template.

 

[Hristo Avramov]

Read my solution
http://xenforo.com/community/threads/trying-to-add-banner-at-ad_header.58833/

 

[Myke623]

Thanks for that, but I already decided that there simply wasn't enough space in my header for both the logo and Ad. Can I at least see a demo of your solution? It appears as though you have the logo sitting on top of the Ad? If so, that wouldn't be ideal for me, as it would take up too much vertical space.

 

[Hristo Avramov]

No, the logo is on the left and the ad in the center.
Tell me if it appears the same way with you .

http://www.betting-forum.com/

 

[Myke623]

Yeah, it appears that way, but when you reduce the browser width the Ad eventually appears under the logo, and behind the menu. This is not ideal for me.

 

[Hristo Avramov]

Everything breaks when you choose a small window so the ad is not a problem. its the way sites are designed. Content gets hidden when the window is not enough to display it.

 

[Myke623]

But isn't that the whole point behind a Responsive design? So that things don't break when they get smaller? Sorry if that's wasn't clear in my original post, but I was trying to have everything working together in a responsive design.

 

[Paul B]

Content gets hidden when the window is not enough to display it.

It's not being hidden though, it is partially visible behind the nav bar.

The correct solution is here: http://xenforo.com/community/threads/trying-to-add-banner-at-ad_header.58833/#post-626914