Masonry: Add image illustrating the arrangement system (#31693)

* Masonry: Add image illustrating the arrangement system

* Rephrase

source/_dashboards/masonry.markdown

@@ -2,7 +2,7 @@
 type: view
 title: Masonry view
 sidebar_label: Masonry (default)
-description: "The default panel layout uses a masonry algorithme."
+description: "The default panel layout uses a masonry algorithm."
 ---
 
 The masonry view is the default view type.
@@ -12,7 +12,14 @@ The masonry view is the default view type.
 Screenshot of the masonry view.
 </p>
 
-It sorts cards in columns based on their `card size`. If you want to group some cards you have to use [horizontal stack](/dashboards/horizontal-stack/), [vertical stack](/dashboards/vertical-stack/), or [grid](/dashboards/grid/) cards.
+Masonry sorts cards in columns based on their card size. The next card is placed below the smallest card on the dashboard.
+
+<p class='img'>
+<img src='/images/dashboards/masonry.png' alt='Image showing how masonry arranges cards based on size.'>
+Masonry arranges cards based on size.
+</p>
+
+To group cards, you have to use [horizontal stack](/dashboards/horizontal-stack/), [vertical stack](/dashboards/vertical-stack/), or [grid](/dashboards/grid/) cards.
 
 {% configuration %}
 type: