docs(modal): add full-width (#3299)

* docs(modal): add full-width

* Update modal-usage-alignment-2.png

* Update modal-usage-alignment-2.png

src/pages/components/modal/usage.mdx

@@ -286,9 +286,9 @@ instead.
 
 ### Alignment
 
-Inside of a modal, body copy, including titles, have a 20%
-[margin-right](/components/modal/style#margin-right). However, form inputs and
-other components expand the full width of a modal window.
+In the modal, at [larger breakpoints](/components/modal/style#margin-right),
+body copy, including titles, have a 20% margin-right. However, form inputs and
+other components expand the entire width of a modal window.
 
 <Row>
 <Column colLg={8}>
@@ -298,6 +298,21 @@ other components expand the full width of a modal window.
 </Column>
 </Row>
 
+#### Full-width content
+
+Certain components, such as a structure list or table, can expand into the
+margins of the modal and align flush to the container edges. These components
+typically have border dividers or containers extending beyond the text or icon.
+Labels or text of any kind should never be in the modal margins.
+
+<Row>
+<Column colLg={8}>
+
+![Modal alignment](images/modal-usage-alignment-2.png)
+
+</Column>
+</Row>
+
 ## Content
 
 ### Main elements