How to make ads responsive

[C_Wilson]

I am a publisher of ad networks, and I wanted to make the 728x90 and 468x60 banner ads responsive since they’re cut off on mobile due to width. My first thought was to show a 300x250 in placement of the 728 and 468 banners on mobile devices only. So I created the following code:

[CODE]

[/CODE]

But that didn’t display any banner ad, it left the header blank. So that code does not work, not sure what I wrote wrong as I can’t detect an issue. Now I’m thinking perhaps there is a way to make the 728x90 and 468x60 responsive, as they pay out more than the 300x250, so why lose out on those sizes?

Is it possible to make it responsive? If so what do I have to do? If it’s not possible, then can someone take a look at my javascript above and potentially fix it?

Here are the original ad codes:

728x90

<div class="container">
  
<!-- Ezoic - Under Page Title - under_page_title -->
<div id="ezoic-pub-ad-placeholder-101">
<script type="text/javascript"><!--
               e9 = new Object();
    e9.size = "728x90,970x250";
//--></script>
<script type="text/javascript" src="tags.expo9.exponential.com/tags/com/ROS/tags.js"></script>
</div>
<!-- End Ezoic - Under Page Title - under_page_title -->
	 	
</div>

300x250

<script type="text/javascript"><!--

               e9 = new Object();

    e9.size = "320x50";

//--></script>

<script type="text/javascript" src="tags.expo9.exponential.com/tags/comMobile/320x50/tags.js"></script>

[chrisofarabia]

What CSS are they using?

[C_Wilson]

The CSS in wordpress is unrelated to the banner ad code. Here’s the full CSS for page:

gist.github.com/pwz2k/2f7d6ff44b572acfd486266835a87e8e

[chrisofarabia]

I’m taking a bit of a guess, as my JS knowledge is in the formative stage, but it looks like your first piece of JavaScript is setting the image tags to a fixed pixel value for their width/height, but there’s no percentage values set in CSS to override those - setting a percentage value in CSS make the images fluid within their parent container.