@patternfly/patternfly 4.222.4 → 5.0.0-alpha.2

package/docs/demos/ContextSelector/examples/ContextSelector.md

@@ -7,10 +7,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="context-selector-in-masthead">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-context-selector-in-masthead"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-context-selector-in-masthead"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="context-selector-in-masthead-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -305,10 +307,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="context-selector-in-sidebar-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-context-selector-in-sidebar-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-context-selector-in-sidebar-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="context-selector-in-sidebar-example-masthead"
@@ -1343,10 +1347,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="context-selector-in-sidebar-expanded-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-context-selector-in-sidebar-expanded-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-context-selector-in-sidebar-expanded-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="context-selector-in-sidebar-expanded-example-masthead"
@@ -2383,10 +2389,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="context-selector-in-page-content-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-context-selector-in-page-content-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-context-selector-in-page-content-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="context-selector-in-page-content-example-masthead"

package/docs/demos/Dashboard/examples/Dashboard.md

@@ -9,10 +9,12 @@ cssPrefix: pf-d-dashboard
 
 ```html isFullscreen
 <div class="pf-c-page" id="dashboard-demo">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-dashboard-demo"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-dashboard-demo"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="dashboard-demo-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -867,6 +869,7 @@ cssPrefix: pf-d-dashboard
         </div>
       </div>
     </section>
+
     <section class="pf-c-page__main-section pf-m-limit-width">
       <div class="pf-c-page__main-body">
         <div class="pf-l-grid pf-m-gutter">

package/docs/demos/DataList/examples/DataList.md

@@ -8,10 +8,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="data-list-basic-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-data-list-basic-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-data-list-basic-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="data-list-basic-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -1521,10 +1523,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="data-list-actionable-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-data-list-actionable-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-data-list-actionable-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="data-list-actionable-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -3012,10 +3016,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="data-list-expandable-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-data-list-expandable-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-data-list-expandable-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="data-list-expandable-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -5112,10 +5118,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="data-list-static-bottom-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-data-list-static-bottom-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-data-list-static-bottom-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="data-list-static-bottom-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button

package/docs/demos/DescriptionList/examples/DescriptionList.md

@@ -9,10 +9,12 @@ cssPrefix: pf-d-description-list
 
 ```html isFullscreen
 <div class="pf-c-page" id="description-list-basic-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-description-list-basic-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-description-list-basic-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="description-list-basic-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -978,10 +980,12 @@ cssPrefix: pf-d-description-list
 
 ```html isFullscreen
 <div class="pf-c-page" id="description-list-in-drawer-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-description-list-in-drawer-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-description-list-in-drawer-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="description-list-in-drawer-example-masthead"
@@ -2235,10 +2239,12 @@ cssPrefix: pf-d-description-list
 
 ```html isFullscreen
 <div class="pf-c-page" id="description-list-complex-content-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-description-list-complex-content-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-description-list-complex-content-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="description-list-complex-content-example-masthead"

package/docs/demos/Drawer/examples/Drawer.md

@@ -8,10 +8,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="drawer-collapsed-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-drawer-collapsed-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-drawer-collapsed-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="drawer-collapsed-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -1110,10 +1112,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="drawer-expanded-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-drawer-expanded-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-drawer-expanded-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="drawer-expanded-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -2036,10 +2040,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="drawer-expanded-bottom-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-drawer-expanded-bottom-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-drawer-expanded-bottom-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="drawer-expanded-bottom-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -2962,10 +2968,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="drawer-jump-links">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-drawer-jump-links"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-drawer-jump-links"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="drawer-jump-links-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -3915,10 +3923,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="drawer-expanded-jump-links">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-drawer-expanded-jump-links"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-drawer-expanded-jump-links"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="drawer-expanded-jump-links-masthead">
     <span class="pf-c-masthead__toggle">
       <button

package/docs/demos/JumpLinks/examples/JumpLinks.md

@@ -7,10 +7,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="jump-links-collapsed-mobile-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-jump-links-collapsed-mobile-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-jump-links-collapsed-mobile-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="jump-links-collapsed-mobile-example-masthead"
@@ -991,10 +993,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="jump-links-vertical-expanded-mobile-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-jump-links-vertical-expanded-mobile-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-jump-links-vertical-expanded-mobile-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="jump-links-vertical-expanded-mobile-example-masthead"
@@ -1975,10 +1979,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="jump-links-vertical-toggle-text-mobile-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-jump-links-vertical-toggle-text-mobile-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-jump-links-vertical-toggle-text-mobile-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="jump-links-vertical-toggle-text-mobile-example-masthead"
@@ -2959,10 +2965,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="jump-links-horizontal-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-jump-links-horizontal-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-jump-links-horizontal-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="jump-links-horizontal-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -3892,10 +3900,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="jump-links-drawer">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-jump-links-drawer"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-jump-links-drawer"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="jump-links-drawer-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -4845,10 +4855,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="jump-links-drawer-expanded">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-jump-links-drawer-expanded"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-jump-links-drawer-expanded"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="jump-links-drawer-expanded-masthead">
     <span class="pf-c-masthead__toggle">
       <button

package/docs/demos/Masthead/examples/Masthead.md

@@ -8,10 +8,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="masthead-basic-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-masthead-basic-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-masthead-basic-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="masthead-basic-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -229,10 +231,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="masthead-context-selecton-drilldown-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-masthead-context-selecton-drilldown-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-masthead-context-selecton-drilldown-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="masthead-context-selecton-drilldown-example-masthead"
@@ -631,10 +635,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="masthead-toolbar-filters-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-masthead-toolbar-filters-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-masthead-toolbar-filters-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="masthead-toolbar-filters-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -961,10 +967,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="masthead-toggle-group-filters-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-masthead-toggle-group-filters-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-masthead-toggle-group-filters-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="masthead-toggle-group-filters-example-masthead"
@@ -1294,10 +1302,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="masthead-expandable-search-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-masthead-expandable-search-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-masthead-expandable-search-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="masthead-expandable-search-example-masthead"
@@ -1479,10 +1489,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="masthead-expandable-search-expanded-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-masthead-expandable-search-expanded-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-masthead-expandable-search-expanded-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="masthead-expandable-search-expanded-example-masthead"
@@ -1680,10 +1692,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="masthead-advanced-with-menu-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-masthead-advanced-with-menu-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-masthead-advanced-with-menu-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="masthead-advanced-with-menu-example-masthead"
@@ -2594,10 +2608,12 @@ wrapperTag: div
 
 ```html isFullscreen
 <div class="pf-c-page" id="masthead-horizontal-nav">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-masthead-horizontal-nav"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-masthead-horizontal-nav"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="masthead-horizontal-nav-masthead">
     <div class="pf-c-masthead__main">
       <a class="pf-c-masthead__brand" href="#">
@@ -3515,10 +3531,12 @@ wrapperTag: div
   class="pf-c-page"
   id="masthead-toggle-group-filters-expanded-mobile-example"
 >
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-masthead-toggle-group-filters-expanded-mobile-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-masthead-toggle-group-filters-expanded-mobile-example"
+    >Skip to content</a>
+  </div>
   <header
     class="pf-c-masthead"
     id="masthead-toggle-group-filters-expanded-mobile-example-masthead"

package/docs/demos/Modal/examples/Modal.md

@@ -7,10 +7,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="modal-basic-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-modal-basic-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-modal-basic-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="modal-basic-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -954,10 +956,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="modal-scrollable-content-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-modal-scrollable-content-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-modal-scrollable-content-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="modal-scrollable-content-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -1910,10 +1914,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="modal-medium-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-modal-medium-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-modal-medium-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="modal-medium-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -2856,10 +2862,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="modal-large-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-modal-large-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-modal-large-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="modal-large-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -3802,10 +3810,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="modal-large-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-modal-large-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-modal-large-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="modal-large-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button
@@ -4748,10 +4758,12 @@ section: components
 
 ```html isFullscreen
 <div class="pf-c-page" id="modal-with-form-example">
-  <a
-    class="pf-c-skip-to-content pf-c-button pf-m-primary"
-    href="#main-content-modal-with-form-example"
-  >Skip to content</a>
+  <div class="pf-c-skip-to-content">
+    <a
+      class="pf-c-button pf-m-primary"
+      href="#main-content-modal-with-form-example"
+    >Skip to content</a>
+  </div>
   <header class="pf-c-masthead" id="modal-with-form-example-masthead">
     <span class="pf-c-masthead__toggle">
       <button