diff --git a/files/en-us/learn/css/howto/highlight_first_line/index.md b/files/en-us/learn/css/howto/highlight_first_line/index.md
index 530683ae723c6dd..9ceca0c1e520e2d 100644
--- a/files/en-us/learn/css/howto/highlight_first_line/index.md
+++ b/files/en-us/learn/css/howto/highlight_first_line/index.md
@@ -24,10 +24,12 @@ In this case we need to use the {{cssxref("::first-line")}} pseudo-element. It s
 
 ## Combining pseudo-elements with other selectors
 
-In the example above, the pseudo-element selects the first line of every paragraph. To select only the first line of the first paragraph, you can combine it with another selector. That could be a class, or in this case the {{cssxref(":first-child")}} {{cssxref("pseudo-classes", "pseudo-class")}}. This allows us to select the first line of the first-child of `.wrapper`.
+In the example above, the pseudo-element selects the first line of every paragraph. To select only the first line of the first paragraph, you can combine it with another selector. In this case, we use the {{cssxref(":first-child")}} {{cssxref("pseudo-classes", "pseudo-class")}}. This allows us to select the first line of the first child of `.wrapper` if that first child is a paragraph.
 
 {{EmbedGHLiveSample("css-examples/howto/highlight_first_line2.html", '100%', 700)}}
 
+> **Note:** When combining pseudo-elements with other selectors in a [complex](/en-US/docs/Web/CSS/CSS_selectors/Selector_structure#complex_selector) or [compound](/en-US/docs/Web/CSS/CSS_selectors/Selector_structure#compound_selector) selector, the pseudo-elements must appear after all the other components in the selector in which they appear.
+
 ## See also
 
 - The {{cssxref("pseudo-elements", "pseudo-elements")}} reference page.