We have a mockup of how we want our BuySellAds zones to look like, so let’s get on building it for real. The BuySellAds website provides the code we need to put on our site for the ads to show up. We copy and paste that over.
We attempt to shut off the CSS that BSA injects onto the site to style them (because we’ll handle that ourselves) but unfortunately if we shut if off now it affects the live site as well, so we have to just fight against the injected CSS for now.
We spend the rest of the time positioning and styling the ads to show up just how we want. It’s pretty easy going since we have so much in place already, like mixins for font stacks and colors and whatnot.
We run into a thing that we run into a number of times in this series, where it would be nice to
@extend a class that only exists in another file, which unfortunately you aren’t able to to. In this example, we’re trying to make a BSA injected div styled just like
.module is, which is a classic case for extend, but alas, we have to copy and paste some styles.
We ponder about flexbox helping us here, but decide it’s just too early for that. It would make the layout easier as well as give us equal heights. Oh well, we’ll put it on the future wishlist.