I was experimenting with the placement of BuySellAds slots on the blog and noticed that many popular blogs have center-aligned the 468×60 ad unit. I found this alignment interesting and just implemented it on my blog as well. I’m sharing with you how to center align a BuySellAds slot with simple CSS.

So, lets start. The idea is to wrap the BuySellAds slot code in a division (<div>) and to style it separately for center alignment in a semantically correct way.

Wrap the code in a div like below in your website’s HTML:

<div class="ca-bsa-wrap">
   <!-- BuySellAds Zone Code -->
   <div id="bsap_12XXXX" class="bsarocks bsap_35XX3XXccXX98XXfbXXd0XXcbXX71XXd"></div>
   <!-- End BuySellAds Zone Code -->
</div>

Save changes.

Center aligning BuySellAds slot

Note: Don’t forget to add the code of your own slot in the wrapper division. I’ve added sample code here to demonstrate.

We have given the wrapper division a class ca-bsa-wrap, which we’ll be using in our CSS to align the slot.

Next, add the following piece of CSS code to your website’s stylesheet:

.ca-bsa-wrap {
   width: 468px; /* Modify this width according to the width of the ad slot */
   margin: 0 auto;
}

Save the changes. Now open your website and have a look at that BuySellAds slot. It should be center-aligned if you’ve followed the above steps correctly. Hope you found it useful.