XF 1.2 Responsive banner after page_container_content_top

[Motobaka]

I’m trying to make a banner a bit responsive. I have already ready most of the available threads about this but seem to be missing something.


We are using a custom style made by Russ.


The thing is that we need to use this huge banner:


It is positioned in PAGE CONTAINER

Right after:

<xen:hook name="page_container_content_top" />

The code placed there is:

<div style="text-align:center;">

<a href="http://www.pokerstars.com/latam/?source=10582518"><img src="/imagenes/bg/2014scoophe.jpg" /></a>

</div>

You can imagine how bad it looks when viewed in a mobile or tablet.

Is there a way for it to change?


I was thinking of giving the div an id and then try to work with it in EXTRA.css but don’t know if that is the way to go.


Any suggestions?

 

[Russ]

Give the div an ID, then use a media query

http://xenforo.com/community/resources/responsive-design.2193/

Like Brogans resource and set a max-width on the img in mobile view.

 

[Motobaka]

Thanks!

Where do I place the media query? In EXTRA.css?

 

[Russ]

Ya you can, also I'm looking at your issue via too I'll get back to you shortly

 

[Motobaka]

Thanks got it not show in mobile version.