diff --git a/files/en-us/web/css/_colon_target/index.md b/files/en-us/web/css/_colon_target/index.md
index 4d0e44edfc3bdd2..45c2ede5cb1b865 100644
--- a/files/en-us/web/css/_colon_target/index.md
+++ b/files/en-us/web/css/_colon_target/index.md
@@ -7,25 +7,25 @@ browser-compat: css.selectors.target
 
 {{CSSRef}}
 
-The **`:target`** [CSS](/en-US/docs/Web/CSS) [pseudo-class](/en-US/docs/Web/CSS/Pseudo-classes) represents a unique element (the _target element_) with an [`id`](/en-US/docs/Web/HTML/Global_attributes/id) matching the URL's fragment.
+The **`:target`** [CSS](/en-US/docs/Web/CSS) [pseudo-class](/en-US/docs/Web/CSS/Pseudo-classes) selects the _target element of the document_. When the document is loaded, the target element is derived using the document's [URL fragment identifier](/en-US/docs/Web/URI/Fragment#fragment).
 
 ```css
-/* Selects an element with an ID matching the current URL's fragment */
+/* Selects document's target element */
 :target {
   border: 2px solid black;
 }
 ```
 
-For example, the following URL has a fragment (denoted by the _#_ sign) that points to an element called `section2`:
+For example, the following URL has a fragment identifier (denoted by the _#_ sign) that marks the element with the [`id`](/en-US/docs/Web/HTML/Global_attributes/id) of `setup` as the document's target element:
 
 ```url
-http://www.example.com/index.html#section2
+http://www.example.com/help/#setup
 ```
 
 The following element would be selected by a `:target` selector when the current URL is equal to the above:
 
 ```html
-<section id="section2">Example</section>
+<section id="setup">Installation instructions</section>
 ```
 
 ## Syntax
@@ -36,6 +36,12 @@ The following element would be selected by a `:target` selector when the current
 }
 ```
 
+## Description
+
+When an HTML document loads, the browser sets its target element. The element is identified using the URL fragment identifier. Without the URL fragment identifier, the document has no target element. The `:target` pseudo-class allows styling the document's target element. The element could be focused, highlighted, animated, etc.
+
+The target element is set at document load and [`history.back()`](/en-US/docs/Web/API/History/back), [`history.forward()`](/en-US/docs/Web/API/History/forward), and [`history.go()`](/en-US/docs/Web/API/History/forward) method calls. But it is _not_ changed when [`history.pushState()`](/en-US/docs/Web/API/History/pushState) and [`history.replaceState()`](/en-US/docs/Web/API/History/replaceState) methods are called.
+
 > [!NOTE]
 > Due to [a possible bug in the CSS specification](https://discourse.wicg.io/t/target-css-does-not-work-because-shadowroot-does-not-set-a-target-element/2070/), `:target` doesn't work within a [web component](/en-US/docs/Web/API/Web_components) because the [shadow root](/en-US/docs/Web/API/ShadowRoot) doesn't pass the target element down to the shadow tree.
 
@@ -61,12 +67,12 @@ The `:target` pseudo-class can be used to highlight the portion of a page that h
 
 <h3>My Fun Article</h3>
 <p id="p1">
-  You can target <i>this paragraph</i> using a URL fragment. Click on the link
-  above to try out!
+  You can target <i>this paragraph</i> using a URL fragment. Click on the first
+  link above to try out!
 </p>
 <p id="p2">
-  This is <i>another paragraph</i>, also accessible from the links above. Isn't
-  that delightful?
+  This is <i>another paragraph</i>, also accessible from the second link above.
+  Isn't that delightful?
 </p>
 ```
 
diff --git a/files/en-us/web/css/css_selectors/using_the__colon_target_pseudo-class_in_selectors/index.md b/files/en-us/web/css/css_selectors/using_the__colon_target_pseudo-class_in_selectors/index.md
index 5e900c232f152d9..4844701f036007d 100644
--- a/files/en-us/web/css/css_selectors/using_the__colon_target_pseudo-class_in_selectors/index.md
+++ b/files/en-us/web/css/css_selectors/using_the__colon_target_pseudo-class_in_selectors/index.md
@@ -6,11 +6,11 @@ page-type: guide
 
 {{CSSRef}}
 
-When a URL points at a specific piece of a document, it can be difficult for the user to notice. Find out how you can use some simple CSS to draw attention to the target of a URL and improve the user's experience.
+When a URL points at a specific piece of a document using a [URL fragment identifier](/en-US/docs/Web/URI/Fragment#fragment), it can be difficult for the user to notice. This guide discusses using CSS to draw attention to the target of a URL to improve user experience.
 
 ## Picking a Target
 
-The [pseudo-class](/en-US/docs/Web/CSS/Pseudo-classes) {{cssxref(":target")}} is used to style the target element of a URL containing a fragment identifier. For example, the URL `https://developer.mozilla.org/en-US/docs/Web/CSS#reference` contains the fragment identifier `#reference`. In HTML, identifiers are found as the values of either `id` or `name` attributes, since the two share the same namespace. Thus, the example URL would point to the heading "reference" in that document.
+The [pseudo-class](/en-US/docs/Web/CSS/Pseudo-classes) {{cssxref(":target")}} is used to style the target element of the document identified using the URL fragment identifier. For example, the URL `https://developer.mozilla.org/en-US/docs/Web/CSS#reference` contains the fragment identifier `#reference`. In HTML, identifiers are found as the values of either `id` or `name` attributes, since the two share the same namespace. Thus, the example URL would point to the element that has the id `reference` in that document.
 
 Suppose you wish to style any `h2` element that is the target of a URL, but do not want any other kind of element to get a target style. This is simple enough: