Vendor-prefixed CSS Property Overview
A list of CSS vendor-prefixes.
Related cards:
CSS: Don't target multiple vendor-prefixed pseudo-elements in a single rule
Some pseudo-elements need to be addressed with vendor prefixes. E.g. ::selection is not supported by Firefox, you ne...
Browser Standards progress: CSS filter property
Some progress was made by browsers on implementing CSS filters like blur, greyscale or some other effects. You might already know the legacy CSS filter attribute that old IE vers...
CSS variables aka CSS Custom Properties
CSS variables are very different from preprocessor variables. While preprocessors use variables to compile a static piece of CSS, CSS custom properties are a reactive (i.e. live) part of the styles. Think of them like usual CSS properties that...
Managing vendor libraries with the Rails asset pipeline
The benefit of the Rails asset pipeline is that it compiles your stylesheets and javascripts to a single file, respectively. However, the consequences are startling if you don't understand them. Among others, the raw asset pipeli...
Centering with CSS vertically and horizontally (all options overview)
There are a million ways to center <div>s or text in CSS, horizontally or vertically. All the ways are unsatisfying in their own unique way, or have restrictions regarding browser support, element sizes, etc.
Here are two great resources for fi...
CSS Fontstack: An overview of web/web safe font support
Web safe fonts are fonts that are pre-installed by many operating systems. While not all systems have the same fonts installed, you can use a web safe font stack to choose several fonts that look similar, and are installed on the various systems...
How to use CSS to rotate text by 90° in IE8 (and modern IEs)
If you want to rotate text, you can use CSS transforms in somewhat modern browsers to rotate the container element.
However, if you need to support IE8, transform is unavailable (if need only IE9 support, ignore the following and use `-ms-transf...
Using CSS counters - CSS | MDN
Counters are an awesome CSS feature you didn't know about. It is supported in all browsers and IE8+.
CSS counters are an implementation of Automatic counters and numbering in CSS 2.1. The...
CSS: The inset CSS shorthand
The inset CSS property is a shorthand that corresponds to the top, right, bottom, and/or left properties. It has the same multi-value syntax of the margin shorthand.
Example
<div class="outer">
<div class="inner">
Some text
...
Center a float horizontally
This card shows you how to center a float horizontally in CSS. Also: find out what techniques are available for your use case and browser requirements in the card linked below.
Note: We have card with [all CSS centering options](https://makan...