Houdini, Behind the CSS

Duration: 25 mins
Rhiana Heath
Software Engineer, Blake eLearning

Traditional CSS is limiting in a number of ways. While it has many, many attributes, if you want to make something outside the DOM box your options are pretty limited. Leading to many CSS hacks to make objects like, triangles for example, a reality in a modern web browser. This clutters up the HTML and CSS with extra elements it doesn't need. This then slows down performance and makes the code harder to read and maintain.

This is where CSS Houdini comes in with its DOM magic. It allows you to craft your own CSS attributes using JS Worklets. Making the code more performant, deliberate and reusable. This can also be combined with their new CSS typed system. Which gives you more control over your attributes and useful errors if something goes wrong.

Today I'll be doing a live demo showing a few examples of how to make new attributes with Houdini. Such as: tooltips, custom borders and backgrounds, custom checkboxes and animations.

You may also be interested in

180 mins
Leading a Team of Subject Matter Experts with Confidence

As a leader, it is impossible to be an expert on all aspects of your delivery - this is why...

50 mins
Building Antifragile Teams

Antifragile systems thrive under stress and through failure. How can we help our teams – systems made up of people...

50 mins
The Dao of Tech Leadership

Effectively managing humans requires a certain level of self-awareness. Therefore, understanding your WHY and what drives you is vitally important...

25 mins
Using Software, AI, DS to Source Growth Opportunities

Growing up in Honduras, Bolivia, India, Nepal and Indonesia, Thomas believes innovation decision making is one of the most far-reaching...

50 mins
Effecting Change—The Art Of Leading Teams

As leaders we want our teams to pursue great ideas and change directions to realize the goals. However, often we...

50 mins
Imposter Syndrome: Overcoming Self-Doubt in Success

Impostor Syndrome is the domain of the high achiever. Those who set the bar low are rarely it’s victim. What...