Category: oocss

  • Re-visiting the secret power of block fomatting context

    Recently I did a quick talk at Sydney Web Apps meetup about block formatting context, focusing on how it changes the way it interacts with floated elements. I first learnt about this “secret weapon” via Nicole’s blogpost but it wasn’t until recently that I really understood how useful it is. In my talk I talked about how…

  • Easy-peasy Rem Conversion with Sass

    I love rem. I’ve been using it since I first read about it in Jonathan Snook’s article, and even more so since I started building responsive websites. So what is rem? Rem is a value that is relative to the root font-size, meaning the font-size that is set on the <html> element. The browser by…

  • Creating Living Style Guides to Improve Performance

    I recently spoke at JSConf about my experience working with Trulia to create a living style guide. The goal for the project was to improve performance, team velocity, and also to have a more consistent design. It was such a fun project (because their engineers were great to work with) and also successful on all…

  • Don’t Style Headings Using HTML5 Sections

    Styling headings is either a deceptively complex problem, or maybe the design of CSS made it appear complex when it need not have done. When styling headings (or really anything) we want three big goals to be met: DRY – Do not repeat yourself. We want to set headings once and never (ok, rarely!) repeat…

  • CSS Lint open sourced

    Nicholas Zakas and I spoke at Velocity a few minutes ago. First we talked about CSS 3 and it’s impact on performance, then we demoed and open sourced CSS Lint! I really couldn’t be more excited (or relieved, I was super duper nervous before this presentation). CSS Lint is a tool to help point out…

  • Our (CSS) Best Practices Are Killing US

    Our (CSS) Best Practices Are Killing US

    I was prepping to speak at Webstock this year when I realized I didn’t want to give the talk I had proposed. I didn’t want to talk about the Mistakes of Massive CSS, because I realized it went deeper than that. In fact, in most cases, the things we considered best practices were leading to…

  • Automating CSS 3 Gradients

    CSS 3 is full of ways to reduce our dependence on background images, one of which is pure CSS gradients. They have several features, which I’m sure designers are salivating over, like multiple color stops, and angled, radial, and linear gradients. Many people had built cool designer-focused tools to make interacting with a somewhat confusing…

  • Performance Double Whammy Hits New Zealand at Webstock

    Interested in Performance and scaling sites to a large number of visitors or pages? I just realized both Steve Souders and I will be giving talks at Webstock next week! This is a pretty amazing opportunity to massively increase your Performance mojo in one go. 🙂 I’m going to be hosting a workshop in which…

  • The hacktastic zoom fix

    Everyone keeps asking me what is with all the “x” in the OOCSS grids… so I finally wrote an article. The short answer is that it isn’t just a clearfix (it does that too), but it also causes the element to stretch wide, even when it has very little content. It is a bit of…

  • Multitasking is killing me (and probably you too)

    Multitasking has been stressing me, robbing me of my focus, my productivity, and my appreciation of the beauty of the exact moment I’m experiencing right now, and dammit, I want my brain back! Once upon a time, I was assigned 21 projects in my first month on a job. Distinct projects, working with different groups…