new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

Tailwind CSS v4 · all subjects

utilities/display

13 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

display utilities complete list

Tailwind v4 provides the following display utilities: inline (display: inline), block (display: block), inline-block (display: inline-block), flow-root (display: flow-root), flex (display: flex), inline-flex (display: inline-flex), grid (display: grid), inline-grid (display: inline-grid), contents (display: contents), table (display: table), inline-table (display: inline-table), table-caption (display: table-caption), table-cell (display: table-cell), table-column (display: table-column), table-column-group (display: table-column-group), table-footer-group (display: table-footer-group), table-header-group (display: table-header-group), table-row-group (display: table-row-group), table-row (display: table-row), list-item (display: list-item), and hidden (display: none).

sr-only utility for screen readers

The sr-only utility hides an element visually while keeping it visible to screen readers. It applies: position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0.

not-sr-only utility to undo sr-only

The not-sr-only utility reverses sr-only styling to make an element visible to both sighted users and screen readers. It applies: position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible; clip-path: none; white-space: normal. This is useful for showing content on larger screens that is hidden on small screens, for example using sm:not-sr-only.

inline vs inline-block vs block display

The inline utility causes text to wrap normally. The inline-block utility wraps the element to prevent text inside from extending beyond its parent. The block utility puts the element on its own line and fills its parent.

flow-root creates block formatting context

The flow-root utility creates a block-level element with its own block formatting context, preventing margin collapse between child and parent elements.

flex utility for flex containers

The flex utility creates a block-level flex container.

inline-flex utility for inline flex containers

The inline-flex utility creates an inline flex container that flows with text.

grid utility for grid containers

The grid utility creates a block-level grid container.

inline-grid utility for inline grid containers

The inline-grid utility creates an inline grid container.

contents utility creates phantom container

The contents utility creates a phantom container whose children act like direct children of the parent element, allowing children to participate in the parent's layout context as if the container did not exist.

table and table layout utilities

Tailwind provides table, table-row, table-cell, table-caption, table-column, table-column-group, table-header-group, table-row-group, and table-footer-group utilities to create elements that behave like their respective HTML table elements.

hidden utility removes element from document

The hidden utility applies display: none, removing an element from the document flow entirely. To visually hide an element while keeping it in the document, use the visibility property instead.

display utilities support responsive design

Display utilities in Tailwind v4 support responsive design prefixes, allowing different display values at different breakpoints.

Give your agent this brain