How to customize an ad box table to make it responsive

  • Resolved mayurjango

    (@mayurjango)


    10 years, 2 months ago

    Hi, on single post pages (after post content) I want to show an Adsense contextual unit (300x250px) and parallel to it a link unit (200x90px).

    That’s possible by creating a table (code shared below).

    <table border="0"><tr>
<td>
<script type="text/javascript"><!--
google_ad_client = "pub-1257872154896248";
/* 300x250, created 3/14/09 */
google_ad_slot = "3328905642";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="https://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</td>
<td align="right" width="750">
<script type="text/javascript"><!--
google_ad_client = "pub-1257872154896248";
/* 200x90, created 10/15/08 */
google_ad_slot = "4098589179";
google_ad_width = 200;
google_ad_height = 90;
//-->
</script>
<script type="text/javascript"
src="https://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</td>
</tr></table>

    But when viewing it on a smartphone, the link unit cuts off and doesn’t acts responsive. How can I customize it such that the link unit displays below the 300×250 ad unit on mobile?

    I hope that’s possible via CSS.

Viewing 5 replies - 1 through 5 (of 5 total)

  • You could try something like this:

    first <td>
  float: left;
  margin-left: 20px;

second <td>
  float: left;
  width: 300px;
  margin-top: 50px;
    Thread Starter mayurjango

    (@mayurjango)

    That didn’t worked but what I wanted works when using the code without a table. Also, I figured out how to hide the 2nd link unit ad when viewing on mobile. ??

    Thread Starter mayurjango

    (@mayurjango)

    Btw.. How can I increase the spacing between these two ad units without using a table? Please describe clearly. ??

    Eg page: https://test.webtrickz.com/?p=71

    Thread Starter mayurjango

    (@mayurjango)

    Sorry for pinging in a resolved thread.

    I just want to apply the below CSS properties to the 200×90 link unit but can’t figure out how to do it.

    padding: 75px 25px 0px 0px;
float: right;

    Plz help!

    Thread Starter mayurjango

    (@mayurjango)

    Anyways, I’ve figured it out now. Thanks ??

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How to customize an ad box table to make it responsive’ is closed to new replies.