CSS

Learnings, snippets, solutions, and other musings around CSS, Sass, and other related technologies.

June 3, 2022

object-fit requires a width and height

The object-fit property requires a width and height to be set on the image.

October 8, 2020 Fixed

Transition flex-basis in Safari, Webkit

(FIXED) As of version 14.0 of Safari on macOS, and release 114 of Safari Technology Preview, webkit can not transition the flex-basis attribute alone, when applied to the transform property.

October 5, 2020

Auto-sizing, responsive grid items

Create a responsive grid of items using CSS-Grid layout, that flows and wraps without media queries.

June 10, 2020

Outlook 2007-16 Does Not Support white-space: nowrap

Outlook 2007-16 does not support white-space: nowrap in HTML/CSS email templates.

April 3, 2019 Fixed

<fieldset> does not support 'grid-gap' on Chrome

A <fieldset> element does not support grid-gap on Google Chrome 73.

April 3, 2019

Checking for CSS environment-variable support

Supporting Firefox when styling for mobile devices notches.

April 3, 2019

Getting CSS Level 4 max() functions to work with Sass variables

How to get these functions to work with normal Sass variables.