Skip to content

Commit 8bf623b

Browse files
authored
Update documentation/docs/05-misc/01-faq.md
1 parent 2f42962 commit 8bf623b

File tree

1 file changed

+1
-1
lines changed

1 file changed

+1
-1
lines changed

documentation/docs/05-misc/01-faq.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -137,7 +137,7 @@ No. Svelte removes the styles from the component and warns you about them in ord
137137

138138
Svelte's component style scoping works by generating a class unique to the given component, adding it to the relevant elements in the component that are under Svelte's control, and then adding it to each of the selectors in that component's styles. When the compiler can't see what elements a style selector applies to, there would be two bad options for keeping it:
139139

140-
- If it keeps the selector and adds the scoping class to it, there is no guarantee that the selector will match the expected elements in the component, and they definitely won't if they were created by a child component or `{@html ...}`.
140+
- If it keeps the selector and adds the scoping class to it, the selector will likely not match the expected elements in the component, and they definitely won't if they were created by a child component or `{@html ...}`.
141141
- If it keeps the selector without adding the scoping class to it, the given style will become a global style, affecting your entire page.
142142

143143
If you need to style something that Svelte can't identify at compile time, you will need to explicitly opt into global styles by using `:global(...)`. But also keep in mind that you can wrap `:global(...)` around only part of a selector. `.foo :global(.bar) { ... }` will style any `.bar` elements that appear within the component's `.foo` elements. As long as there's some parent element in the current component to start from, partially global selectors like this will almost always be able to get you what you want.

0 commit comments

Comments
 (0)