Articles by

Geoff Graham

Read, write, coffee, web, repeat.

Direct link to the article container

container

The CSS container property is a shorthand that combines the container-name and container-type properties into a single declaration.

.parent {
  container: cards-grid / inline-size;

  /* Equivalent to: */
  container-name: cards-grid;
  container-type: inline-size;
}
Constituent properties

The container property is a …

Case-Sensitive Selectors

/* Case sensitive */
a[href*='css-tricks' s] {}

/* Case insensitive */
a[href*='css-tricks' i] {}

Adding an s makes the selector case-sensitive and i makes it case-insensitive.

Source

Basic View Transition

<meta name="view-transition" content="same-origin" /

That goes right in the <head of your HTML document and it’s the most basic of basic view transitions. The effect is a cross-fade between two pages.…

(Updated on )