Add callout to drilldown docs explaining that the height of the menu doesn't change

diff --git a/docs/pages/drilldown-menu.md b/docs/pages/drilldown-menu.md
index ef587cbe7786e72b5726cd83264dd75b6ad99439..57c9d9d2c3b3ad8e0a16a649af39136ce71255d2 100644 (file)
--- a/docs/pages/drilldown-menu.md
+++ b/docs/pages/drilldown-menu.md
@@ -9,7 +9,7 @@ js: js/foundation.drilldown.js
 
 Drilldowns use the standard [Menu](menu.html#nested-style) syntax, using `<ul>`, `<li>`, and `<a>`. Add `data-drilldown` to the root menu to set up the drilldown.
 
-To create sub-menus, place a `<ul>` *next to* an `<a>`. Clicking that `<a>` will then open the `<ul>` it's next to.
+To create sub-menus, place a `<ul>` *next to* an `<a>`. Clicking that `<a>` will then open the `<ul>` that it's next to.
 
 Any `<a>` without a submenu will function like a normal link.
 
@@ -26,6 +26,10 @@ Any `<a>` without a submenu will function like a normal link.
 </ul>
 ```
 
+<div class="primary callout">
+  <p>The drilldown menu takes on the height of the tallest menu in the hierarchy, so the menu doesn't change height as the user navigates it.</p>
+</div>
+
 <ul class="menu" data-drilldown style="width: 200px" id="m1">
   <li>
     <a href="#">Item 1</a>

diff --git a/docs/pages/menu.md b/docs/pages/menu.md
index 130603e012eb1a808428f64daa0196e076908b73..cbd009261b0d2f02e4852e2158013988ff3d7d90 100644 (file)
--- a/docs/pages/menu.md
+++ b/docs/pages/menu.md
@@ -66,7 +66,7 @@ To align items in the middle, add a wrapping element with the class `.menu-cente
 </div>
 ```
 
----
+<br>
 
 Items can also be set to expand out and take up an even amount of space, with the `.expanded` class. Thanks to the magic of CSS, the items will automatically size themselves equally depending on how many are inside the menu.