If you are looking to update any project or create a new project using the Office Fabric UI Grid, be aware that there was a major update from version 7 to version 8.0.0. In a majority of the grids available through various frameworks, the structure usually goes as follows:
Before V.8.0.0, the columns would have a “Float:left” allowing for the columns to float and stack as the screen width is decreased.
After moving to V8.0.0 or higher, you will need to make an adjustment to your HTML structure. To see your columns return to a responsive layout, add “class=”ms-Fabric” dir=”ltr“” to the “body”. Microsoft updated the float to be associated to the .ms-Fabric class instead of being directly on the column classes.
The documentation on this change is not available on the Layout Page, so you have to read the fine print in the latest release notes to find it. Please pass along to help save some time for the community.
For more information about the MS Grid and basic structure and breakpoints, please visit the Office UI Fabric Page.