# Forcing Grid Stacking with Bootstrap on Mobile

DevFeed: [Forcing Grid Stacking with Bootstrap on Mobile](<https://devfeed.tech/articles/forcing-grid-stacking-with-bootstrap-on-mobile-28132.md>)

Original publisher: [Read original article](<http://fuzzyblog.io/blog/bootstrap/2021/12/23/forcing-grid-stacking-with-bootstrap-on-mobile.html>)

Author: Fuzzygroup

Published: 2021-12-23T17:33:00Z

Content type: tutorial

Language: en

Sources: [Scott Johnson](<https://devfeed.tech/sources/scott-johnson.md>)

Topics: [Bootstrap](<https://devfeed.tech/topics/bootstrap.md>), [Mobile](<https://devfeed.tech/topics/mobile.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>)

Tags: [bootstrap](<https://devfeed.tech/tags/bootstrap.md>), [html](<https://devfeed.tech/tags/html.md>), [mobile](<https://devfeed.tech/tags/mobile.md>)

## AI overview

The article explains that a Bootstrap layout failed to stack or wrap correctly on mobile because the page lacked a viewport meta tag. Adding `<meta name="viewport" content="width=device-width, initial-scale=1">` to the HTML head fixed the mobile formatting.

## Source excerpt

I recently had the situation where a Bootstrap application: Worked perfectly on a desktop with a side by side layout Properly wrapped on desktop when the window was resized down to a mobile like form factor Failed to ever wrap on mobile showing just a smaller version of the desktop I puzzled over this quite a bit until I ran a google search for "bootstrap text too small on mobile" which led me to this directive: <meta name="viewport" content="width=device-width, initial-scale=1"> This needs to be inserted into your html head element and then, like magic, made everything format perfectly on mobile.