fit-content() Formal syntax section shows an error

[Hexstream]

MDN URL

https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content_function

What specific section or headline is this issue about?

Formal syntax

What information was incorrect, unhelpful, or incomplete?

Error: could not find syntax for this item

What did you expect to see?

The formal syntax for fit-content().

Do you have any supporting links, references, or citations?

Apparently, this should be treated the same as minmax(), which does have a working Formal syntax section.

Do you have anything more you want to share?

No response

MDN metadata

Page report details

• Folder: en-us/web/css/fit-content_function
• MDN URL: https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content_function
• GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/css/fit-content_function/index.md
• Last commit: c9f96f0
• Document last modified: 2024-12-20T11:09:30.000Z

[wbamberg]

Thank for filing!

Apparently, this should be treated the same as minmax(), which does have a working Formal syntax section.

"treated the same as minmax()", when this comment was written, meant not including formal syntax, because neither of those functions were marked up as functions in the specs, so didn't appear in the @webref/css package, which is used as the source for this content.

But recent PRs like #37210 then added formal syntax for all functions, including fit-content(). What I don't understand though is why this works in the preview page (https://pr37210.content.dev.mdn.mozit.cloud/en-US/docs/Web/CSS/fit-content_function#formal_syntax) but not in production. Perhaps they are using different versions of @webref/css?

[skyclouds2001]

yes, it seems very strange...

[OnkarRuikar]

We have two pages for fit-content:

1. https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content - spec Box sizing module
2. https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content_function - wrongly shows box sizing module as specs but should be shown as part of the grid layout module (ping @estelle). And webref does have syntax for it.

---

In the local dev environment, yarn start (Yari) shows the syntax, and yarn start:rari doesn't. (ping @fiji-flo )

[server] buildDocumentFromURL(/en-US/docs/Web/CSS/fit-content_function): 483.446ms
[server] using http://localhost:8083/en-US/docs/Web/CSS/fit-content_function
[rari]  WARN serve{req=11}:url{/en-US/docs/Web/CSS/fit-content_function}:page{en-US:Web/CSS/fit-content_function}
  :templ{templ="csssyntax" line=49 col=1}
  : rari_doc::templ::render: Error: could not find syntax for this item

Prod has moved to Rari, but GitHub workflows are still using Yari. Based on the discussions about other PRs, GitHub workflows will be updated in the near future.

[wbamberg]

We have two pages for fit-content:

1. https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content - spec Box sizing module

2. https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content_function - wrongly shows box sizing module as specs but should be shown as part of the grid layout module (ping @estelle). And webref does have syntax for it.

Yes, I know there are two pages for fit-content. This issue is about the page for the fit-content() function. We don't include formal syntax in keyword pages.

Prod has moved to Rari, but GitHub workflows are still using Yari. Based on the discussions about other PRs, GitHub workflows will be updated in the near future.

Ah, OK, so this seems like a rari issue.

[fiji-flo]

Sorry for this. There was no occurrence of {{csssyntax}} using an argument. I'll release support for this nowish.

I see this being used 3 times:

• font-stretch: an alias to font-width this has been around for a while but worked since cssref contained font-stretch if I see this correct.
• fit-content: stripping the _function from the slug.
• url: stripping the _function from the slug.

It's easy to strip and option _function for page-type css-function in the macro if we want this. Then there's only the aliasing case left. Any idea?

(I might respond slowly as I'm only back working next week)

[skyclouds2001]

for references:

#37212
#37211
#37210

[OnkarRuikar]

This issue is about the page for the fit-content() function. We don't include formal syntax in keyword pages.

😕 You called it a function yourself! Unlike fit-content, the fit-content() is a value function. How is grid-template-rows: fit-content(40%) different from width: calc(2em * 5) in terms of being a value function? Or width: fit-content(10%); different from width: var(--default-width)?

---

Then there's only the aliasing case left. Any idea?

• I've raised Need to have alias field for CSS features w3c/webref#1427