Besoin d'une explication - Interactive example editor with empty CSS declaration.

[DomOBU]

MDN URL

https://developer.mozilla.org/fr/docs/Web/HTML/Element/em

What specific section or headline is this issue about?

No response

What information was incorrect, unhelpful, or incomplete?

Bonjour,

Le CSS de l’exemple interactif de la page contient em { }. C’est-à-dire un sélecteur sans déclarations à l’intérieur. Ceci se produit dans différentes pages.

Dans : https://developer.mozilla.org/fr/docs/Learn/CSS/First_steps/What_is_CSS il est précisé que l’on trouve à l’intérieur des accolades une ou plusieurs déclarations.

Ma question : quel est l’intérêt/l’objectif de mettre dans le CSS un sélecteur sans déclarations ?

Merci pour la réponse

What did you expect to see?

pourquoi un sélecteur sans déclarations

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

No response

Do you have anything more you want to share?

No response

MDN metadata

Page report details

• Folder: fr/web/html/element/em
• MDN URL: https://developer.mozilla.org/fr/docs/Web/HTML/Element/em
• GitHub URL: https://github.com/mdn/translated-content/blob/main/files/fr/web/html/element/em/index.md
• Last commit: https://github.com/mdn/translated-content/commit/d00f2a5989c4ca59e278585ba53f3181fe77ce43
• Document last modified: 2022-09-21T09:45:21.000Z

[SphinxKnight]

@schalkneethling @wbamberg, is there a motivation for keeping the CSS tab in the interactive example for HTML element pages?

I've read a few things over mdn/interactive-examples (https://github.com/mdn/interactive-examples/pull/796 and https://github.com/mdn/interactive-examples/issues/700) but I'm not sure of the current consensus vs. the current state of pages.

Thanks for your feedback.

Edit: can you as well transfer this issue to mdn/interactive-examples?

[welcome[bot]]

👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it.

[DomOBU]

Merci pour votre retour et ces informations.

Peut être que pour un débutant comme moi, qui se pose des questions qu’un expert ne se pose pas, il serait possible d’ajouter une deuxième note à la fin du paragraphe « Syntaxe de CSS » du type (à réécrire certainement) :

Les exemples présentés dans les différentes pages HTML sur MDN sont relativement simples. Une feuille CSS n’est parfois pas nécessaire au HTML de l’exemple. Cependant souvent une feuille CSS très simple, par exemple avec un sélecteur sans déclarations, est néanmoins associée au HTML. Elle permettra en ajoutant des déclarations au sélecteur d’analyser les impacts sur l’HTML de l’exemple.

[wbamberg]

Sorry to be slow replying. I don't think we have a clearly expressed consensus here.

Merci pour votre retour et ces informations.

Peut être que pour un débutant comme moi, qui se pose des questions qu’un expert ne se pose pas, il serait possible d’ajouter une deuxième note à la fin du paragraphe « Syntaxe de CSS » du type (à réécrire certainement) :

Les exemples présentés dans les différentes pages HTML sur MDN sont relativement simples. Une feuille CSS n’est parfois pas nécessaire au HTML de l’exemple. Cependant souvent une feuille CSS très simple, par exemple avec un sélecteur sans déclarations, est néanmoins associée au HTML. Elle permettra en ajoutant des déclarations au sélecteur d’analyser les impacts sur l’HTML de l’exemple.

I don't think we should do this. I don't think it will be helpful for many people, and when it is helpful, it is helpful exactly once - it's a thing you learn about our examples and then never have to know again. But we would need to put it in every CSS page, all the time, and it is then extra stuff which almost everyone has to skate over when they are trying to learn about a feature.

[wbamberg]

In terms of our examples, there are three options when we don't want them to ship with active CSS:

1. omit the CSS tab
2. have an empty CSS tab (which used to be impossible, see https://github.com/mdn/interactive-examples/issues/700)
3. have a CSS tab with an empty rule, as we do for <em> (see https://github.com/mdn/interactive-examples/pull/796 and https://developer.mozilla.org/fr/docs/Web/HTML/Element/em)

Reading https://github.com/mdn/interactive-examples/pull/796 I'm a little unclear whether we adopted case 3 because we liked it or as a workaround for the bug reported in https://github.com/mdn/interactive-examples/issues/700.

I think it is nice to include the CSS tab even if we don't have any CSS (because otherwise people can't add any). That is, I like 2 and 3 better than 1.

I think it is probably clearer to omit the CSS entirely rather than have an empty rule. So I can see 2 is maybe better than 3.

But if we went with 2 or 3, we might solve the reporter's issue with a comment in the empty CSS file or the empty rule, along the lines suggested in https://github.com/mdn/interactive-examples/issues/2354#issuecomment-1339238504. This is better than just including it in the page, because people would only have to see the comment when it is relevant.