From ad71a19e04b1db43bcae8c78dd6c66922b5d08f9 Mon Sep 17 00:00:00 2001 From: wbamberg Date: Wed, 11 Oct 2023 13:50:07 -0700 Subject: [PATCH] Update files/en-us/web/api/web_components/using_shadow_dom/index.md Co-authored-by: Estelle Weyl --- .../en-us/web/api/web_components/using_shadow_dom/index.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/files/en-us/web/api/web_components/using_shadow_dom/index.md b/files/en-us/web/api/web_components/using_shadow_dom/index.md index 9c825d47353b5ab..302feb838f9990f 100644 --- a/files/en-us/web/api/web_components/using_shadow_dom/index.md +++ b/files/en-us/web/api/web_components/using_shadow_dom/index.md @@ -208,9 +208,9 @@ The page CSS does not affect nodes inside the shadow DOM: To style page elements in the shadow DOM, we can: -- Create an empty {{domxref("CSSStyleSheet")}} object -- Set its content using {{domxref("CSSStyleSheet.replace()")}} or {{domxref("CSSStyleSheet.replaceSync()")}} -- Add it to the shadow root by assigning it to {{domxref("ShadowRoot.adoptedStyleSheets")}} +1. Create an empty {{domxref("CSSStyleSheet")}} object +2. Set its content using {{domxref("CSSStyleSheet.replace()")}} or {{domxref("CSSStyleSheet.replaceSync()")}} +3. Add it to the shadow root by assigning it to {{domxref("ShadowRoot.adoptedStyleSheets")}} Rules defined in the `CSSStyleSheet` will be scoped to the shadow DOM tree, as well as any other DOM trees to which we have assigned it.