@@include('../../templates/modules/components/DocumentationPageHeader.html')
Fabric comes with a mobile-first, 12-column, responsive grid that you can use to create flexible layouts for a variety of screen sizes and device types.
@@include('../../templates/modules/content/styles-responsive-grid.html')Visibility
Some designs call for certain content to be shown or hidden depending on the screen size. You can achieve this using Fabric's responsive visibility classes. These allow you to show or hide content at a specific screen size, or across a whole range of sizes.
Visibility class | Hides content on screen of size | ||||||
---|---|---|---|---|---|---|---|
SM | MD | LG | XL | XXL | XXXL |
How to use
<div class="ms-Grid-col ms-sm12 ms-hiddenXlDown">hidden on small</div>
<div class="ms-Grid-col ms-sm12 ms-hiddenXxlUp">hidden on large up</div>