CSS

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

object-fit requires a width and height

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

Read more
  • Bug
  • 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 cannot transition the flex-basis property on its own — it has to be included alongside other properties in the transition shorthand.

Read more

Auto-sizing, responsive grid items

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

Read more

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

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

Read more
  • Bug
  • Fixed

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

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

Read more

Checking for CSS environment-variable support

Supporting Firefox when styling for mobile devices notches.

Read more

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

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

Read more