The top module in the main sidebar of the site belongs to Treehouse, as the main sponsor of CSS-Tricks. Based on a conversation I had with Ryan Carson, some of the best converting ads they have are the ones with people in them, so we pick out one of those to use for the graphic in the module.

When we stick the image in, it hangs outside the module and has way too much spacing around it. With our new SCSS file just for modules, we write in some new rules for how image ad modules behave (no padding, full-width images).

Once we finish up with that we start going off on a tangent making other tweaks specifically for the narrowest media query breakpoint.

Comments

  1. User Avatar
    Joi
    Permalink to comment#

    This one should be the 46 screencast instead of 48 since what you do in this one is already done in 46 and 47 atm :)

Submit a Comment

Posting Code

You may write comments in Markdown. This makes code easy to post, as you can write inline code like `<div>this</div>` or multiline blocks of code in triple backtick fences (```) with double new lines before and after.

Code of Conduct

Absolutely anyone is welcome to submit a comment here. But not all comments will be posted. Think of it like writing a letter to the editor. All submitted comments will be read, but not all published. Published comments will be on-topic, helpful, and further the discussion or debate.

Want to tell us something privately?

Feel free to use our contact form. That's a great place to let us know about typos or anything off-topic.

icon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag