w3c / w3c/csswg-drafts

[css-align] Apply align-content to replaced elements

Open
#4,545 9 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Commenter Response Pending css-align-3
Dominant language
Bikeshed
Stars
4.9k
Forks
816
PR merge metrics
PR metrics pending

Description

The spec for align-content says:

Applies to: block containers, multicol containers, flex containers, and grid containers

An image is not a block container, nor any of the other containers listed.

So, per those definitions, align-content:baseline does not apply to an <img> grid item.

However, the spec for Baseline Content-Alignment says for Grid items:

A grid item participates in first/last baseline content-alignment in its startmost/endmost row or column (whichever is parallel to its inline axis) and if its computed align-content is first baseline/last baseline.

A strict reading of the spec implies that Baseline Content-Alignment does not apply to an <img> grid item since the align-content property doesn't even apply to images. Is this is the intention of the spec? I see no particular reason why images, for example, shouldn't be allowed to participate in baseline alignment using align-content:baseline.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked CSS Align 3 sections on align-content and Baseline Content-Alignment, then compare their applicability rules for replaced elements. Done means the CSS Working Group resolves the intended behavior and records that resolution in the relevant specification text.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
documentation, web-dev
Issue type
Documentation
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.