CSS Specificity Wars

Kat showed us a site that easily describes CSS specificity. This Star Wars fan has made it easy to understand the specificity of CSS selectors. In this way you can see how powerful the dark side of the CSS selectors can be...

CSS Specificity Wars

Collab Session

Patricio introduced us to CodePen Collab Session. Collab Mode allows more than one person to edit a Pen at the same time. If you've ever used collaborative editing in Google Docs, it's like that! Real-time pair programming at its best, since the two (or more) people can be anywhere in the world! Super cool!

Collab Session

CSS-Stacking Elements

Martin S talked about stacking elements. Sometimes we wish to put an element on top of everything. This element may be deep down in hierarchies, and it may be tricky to level up the correct z-index. The key is to identify which elements are enabling a ‘local stacking context’. Most known may be the elements which are absolutely, fixed or relatively positioned, but adding to this are elements with:

  • an opacity less than 1
  • transform valule other than none
  • mix-blend-mode value other than normal
  • filter value other than none
  • perspective value other than none
  • See the links below to get the deeper picture:
    The Stacking Context
    Understanding CSS z-index


    Ian wanted to present a very well-written article on Building and Maintaining Optimizly's UI or "OUI" for short.

    Opitimizely are not particularly revolutionary in what they do. Many, if not all of their tools and processes can be found in our product too. However, there was something about the way this article was written that really helped him finally understand the hows & whys of keeping your work:

    • Abstracted
    • Reusable
    • Mixable
    • Variable-powered
    • Scalable
    • Consistant
    • D.r.y

    Ian suggested this is a good read for noobs and optimisation-masters alike.

    791 0 0