Skip to content

Add description to background shorthand property #42695

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
estelle merged 7 commits into from
Jan 9, 2026
Merged

Add description to background shorthand property #42695

estelle merged 7 commits into from
Jan 9, 2026
+44 −18

Conversation

@estelle
Copy link
Member

@estelle estelle commented Jan 8, 2026

Creates the property description section.
move stuff that should be in description from other sections into the new section.
Add information of layer order.
add information about body bg being added to HTML bg
add containment exception
add links.

fixes #42643

@estelle estelle requested a review from a team as a code owner January 8, 2026 22:15
@estelle estelle requested review from chrisdavidmills and removed request for a team January 8, 2026 22:15
@github-actions github-actions bot added Content:CSS Cascading Style Sheets docs size/m [PR only] 51-500 LoC changed labels Jan 8, 2026
@github-actions
Copy link
Contributor

github-actions bot commented Jan 8, 2026 •
edited
Loading

Preview URLs

Flaws (205)

URL: /en-US/docs/Web/CSS/Reference/Properties/background
Title: background
Flaw count: 205

  • broken_links:
    • Link /en-US/docs/Web/CSS/color_value#interpolation is a redirect
    • Link /en-US/docs/Web/CSS/CSS_values_and_units/Value_definition_syntax#hash_mark is a redirect
    • Link /en-US/docs/Web/CSS/CSS_values_and_units/Value_definition_syntax#question_mark is a redirect
    • Link /en-US/docs/Web/CSS/CSS_values_and_units/Value_definition_syntax#double_bar is a redirect
    • Link /en-US/docs/Web/CSS/CSS_values_and_units/Value_definition_syntax#brackets is a redirect
    • and 195 more flaws omitted
  • macros:
    • Macro cssinfo produces link /en-US/docs/Web/CSS/CSS_cascade/Value_processing which is a redirect
    • Macro cssinfo produces link /en-US/docs/Web/CSS/CSS_cascade/Inheritance which is a redirect
    • Macro cssinfo produces link /en-US/docs/Web/CSS/CSS_cascade/Value_processing which is a redirect
    • Macro cssinfo produces link /en-US/docs/Web/CSS/CSS_animated_properties which is a redirect
    • Macro cssinfo produces link /en-US/docs/Web/CSS/url which is a redirect

(comment last updated: 2026-01-09 11:17:05)

chrisdavidmills
chrisdavidmills requested changes Jan 9, 2026
View reviewed changes
Copy link
Contributor

@chrisdavidmills chrisdavidmills left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@estelle looking mostly pretty good; just a few bits for you to sift through.

files/en-us/web/css/reference/properties/background/index.md
- : See {{Cssxref("background-image")}}. Default: `none`.
- `<bg-position>`
- : See {{cssxref("background-position")}}. Default: 0% 0%.
- : See {{cssxref("background-position")}}. Default: `0% 0%`.
Copy link
Contributor

@chrisdavidmills chrisdavidmills Jan 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just above here, <'background-color'> should be changed to <background-color> for consistency and correctness, surely? There are other instances further down too.

Copy link
Member Author

@estelle estelle Jan 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I originally thought the same thing, but it's the only value that is an actual property, and the formal syntax has it this way.
formal syntax showing only the color with a single quote

Copy link
Contributor

@chrisdavidmills chrisdavidmills Jan 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, OK. Weird, but fair enough ;-)

files/en-us/web/css/reference/properties/background/index.md Outdated

### Property components

The `background` shorthand property enables you to declare all CSS background properties in a single declaration. The background lies underneath the content of an element; the content of an element is painted on top of it's background. When you have multiple, comma separated background values, each is background layer that is painted on top of the previous layers.
Copy link
Contributor

@chrisdavidmills chrisdavidmills Jan 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The Description content seems correct, but weirdly structured. It should start with this bit, which explains what the shorthand does at a high level, and the bit you've got at the top should be put further down.

estelle
estelle commented Jan 9, 2026
View reviewed changes
Copy link
Member Author

@estelle estelle left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thanks for the review

files/en-us/web/css/reference/properties/background/index.md
- : See {{Cssxref("background-image")}}. Default: `none`.
- `<bg-position>`
- : See {{cssxref("background-position")}}. Default: 0% 0%.
- : See {{cssxref("background-position")}}. Default: `0% 0%`.
Copy link
Member Author

@estelle estelle Jan 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I originally thought the same thing, but it's the only value that is an actual property, and the formal syntax has it this way.
formal syntax showing only the color with a single quote

chrisdavidmills
chrisdavidmills approved these changes Jan 9, 2026
View reviewed changes
Copy link
Contributor

@chrisdavidmills chrisdavidmills left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@estelle Yessss, looking great! I've just got one more nitpick for you, but I'll approve it. I don't think I need to see this again.

@estelle estelle merged commit 17fe7cf into main Jan 9, 2026
13 checks passed
@estelle estelle deleted the bg branch January 9, 2026 11:49
Anurella added a commit to Anurella/content that referenced this pull request Jan 12, 2026
@Anurella
Merge branch 'main' of https://github.com/Anurella/content
9ae3a51 
* 'main' of https://github.com/Anurella/content: (7201 commits)
  Update InterfaceData based on WebRef (mdn#42718)
  fix typo in `PeroformanceResourceTiming.requestStart` (mdn#42724)
  fix: auto-cleanup by bot (mdn#42717)
  fix typo in RTCTransportStats (mdn#42704)
  Fix typo in queuingStrategy variable name (mdn#42706)
  Update guidance on <hr> styling (mdn#42708)
  Fx147: Add relnote for iterator sequencing support (mdn#42713)
  Fix order of arguments in SpeechRecognitionPhrase ctor (mdn#42711)
  Update warnings about event handler attributes (mdn#42347)
  chore(deps-dev): bump fs-extra from 11.3.2 to 11.3.3 (mdn#42468)
  ci(deps): bump actions/download-artifact from 6.0.0 to 7.0.0 (mdn#42404)
  ci(deps): bump actions/upload-artifact from 5.0.0 to 6.0.0 (mdn#42402)
  ci(deps): bump peter-evans/create-pull-request from 7.0.11 to 8.0.0 (mdn#42403)
  Explain value repetition when fewer background values are specified (mdn#42627)
  Add description to background shorthand property (mdn#42695)
  chore(deps): bump @mdn/fred from 1.9.7 to 2.0.0 (mdn#42702)
  chore(deps): bump qs from 6.14.0 to 6.14.1 (mdn#42598)
  Bump node-html-parser from 7.0.1 to 7.0.2 (mdn#42659)
  update documentation to note that Firefox for Android requires CT (mdn#42672)
  TrustedTypes: Function() constructor + eval() (mdn#42462)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@chrisdavidmills chrisdavidmills chrisdavidmills approved these changes

Assignees

No one assigned

Labels

Content:CSS Cascading Style Sheets docs size/m [PR only] 51-500 LoC changed

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Add explanation that CSS background propagate from body to html

2 participants

@estelle @chrisdavidmills