Footer Widgets Formatting

I am trying to put ads (250 x 250px) in my four footer widgets. I would like them evenly spaced with matching borders but am not having any luck with trying to figure it out.

Please see screenshot showing a 1px border around each widget, and notice that none of the ads are centered within the boxes.

The Custom CSS I'm using is
/* Begin - Footer Widgets - adjust padding - keeps 250 x 250 image size correct and prevents shifting to the right */
.inside-footer-widgets.inner-padding {
padding: 0px; }

/* Begin - Footer Widget Format For 4 images 250 x 250 each */
.footer-widget-1.grid-parent.grid-25.tablet-grid-50,
.footer-widget-2.grid-parent.grid-25.tablet-grid-50,
.footer-widget-3.grid-parent.grid-25.tablet-grid-50,
.footer-widget-4.grid-parent.grid-25.tablet-grid-50 {
border: 1px solid #000;
text-align:center;
height: 266px;
width: 266px;
}

/* Begin - Adzone Sidbar Padding */
.paszone_container {
padding:10px 0px 11px 2px;
}

Could you please help. Support Access is granted. Thank you.

  • Mary

    Sorry to re-open this ticket but I'm noticing that although each of my ads is 250 x 250 they are not evenly spaced.

    Please note white space between each ad. I created the first three so I know for sure that they are exactly 250 x 250, and I don't know if you would know why the fourth is showing scroll bars. It is a google ad, supposedly 250 x 250.

    Support Access is granted. Would appreciate any help. Thank you!

  • Adam Czajczyk

    Hello Mary!

    I checked your site's HTML/CSS and it look like those adds do have an "inline CSS" (the CSS rules are withing HTML code). Two first ads do have a "margin: 0 auto;" rule added while other two don't have it.

    I'm referring here to the inline styles of following DIVs:

    #paszonecont_23172, #paszonecont_23173 (these two are fine)

    and

    #paszonecont_23174, #paszonecont_23175 (these are "misplaced")

    Adding

    margin: 0 auto;

    to the inline styles of these two "misplaced" divs should fix that issue.

    As for the scrollbars. The last ad (Google AdSense ad) is added as an "iframe" element. I'm not sure how are you serving that add but I assume that the code that's been placed somewhere in your "ads rotator" is

    <iframe src="some url" width="250" height="250"></iframe>

    Try adding

    scrolling="no"

    attribute to it like this

    <iframe src="some url" width="250" height="250" scrolling="no"></iframe>

    and I think that should help.

    Best regards,
    Adam

  • Adam Czajczyk

    Hello Mary!

    I'm glad I could help.

    I checked the site again and for me the Google Ads ad is currently vertically aligned nicely but other ads look a bit "weird" (they are not entirely visible). Since I'm not sure whether it's only a caching issue (server or on my side) or if you are currently applying some changes to the site, let me know please when you are ready to proceed and sure that remaining ads are fine (or that they need another intervention). I'll then jump back in :slight_smile:

    Best regards,
    Adam

  • Adam Czajczyk

    Hello Mary!

    Thank you for letting me know. I think that must have indeed either be a caching issue or I just "jumped in" while you were making changes because now all the other ads look fine.

    I wasn't able to replicate the "google ad" issue as each time I refreshed the site (I checked it using Chrome, Firefox and also Opera using different VPN locations; I also used two screens of different resolutions) the ads were served that fulfilled the ad-space as expected. Take a look at the screenshot please:

    That said, I assume it's that only some of the ads are that way. I think it's the case where the ad content is actually smaller than the box provided by Google. I mean, that it's possible that for some adverts the advertiser has uploaded smaller content and Google accepted it. If this is the case, there's not much that can be done because the "box" served by Google is always the same size and it is well aligned (see my screenshot). If an ad inside this "box" is smaller than the "box" itself it's up to Google scripts how it will be positioned and I think we cannot change it. Certainly not with just simple CSS. I admit I'm no expert in Google Ads code and I'm not sure if there's any option to affect that by e.g. adding some parameters to it but I think two-three years ago there wasn't any. If that didn't change, I'm afraid that would be something to, unfortunately, "just accept" :slight_frown: That is, of course, unless I'm missing something here...

    Best regards,
    Adam