Browser rendering engines are very slow at rendering large box shadows. I had a situation where a complex layout with...
The attached compiler() function below applies JavaScript behavior to matching HTML elements as they enter the DOM. This works like...
All browsers + IE9 know the CSS :empty selector. It lets you hide an element when it has no content, i.e...
The need for clearfix hacks has been greatly reduced since we could layout with Flexbox or CSS Grid.
You can scale background images in CSS to the container size using background-size (Demo). Commonly, we use contain or...
When using custom properties in your stylesheets, you may want to set a specific property value to an existing variable...
You probably know that you can use CSS selectors to match against elements and their attributes, such as:
After switching a project from Sprockets to Webpack, I started observing a bug that was hard to debug: Our...
To keep JavaScript sources small, it can sometimes make sense to split your webpack bundles. For example, if your website...
Over the years we have tried several solution to have vector icons in our applications. There are many ways to...
Webpack builds can take a long time, so we only want to compile when needed. This card shows what will...
The attached article examines what the percent unit (%) is relative to in CSS The article does a great job of...
When you have a hex color code, you can easily convert it into its RGB values using plain Ruby.
Raising JavaScript errors in Cucumber With selenium JavaScript errors do not cause any failure in your cucumber scenarios. To archive...
Rails 6 includes a WYSIWYG editor, Action Text. It works out of the box quite well, but chances are that...
Imagine you have 2 HTML boxes. The first one has a margin-bottom of let's say 30px and the...
Localizing a non-trivial application can be a huge undertaking. This card will give you an overview over the many...
Rails supports alert and notice as default flash types. This allows you to use these keys as options in e.g...