http://stackoverflow.com/questions//container-fluid-vs-container
https://www.jquery-az.com/bootstrap-container-and-container-fluid-what-is-the-difference/
The .container class is the fixed width container. That does not mean it is not responsive. It is responsive; however, it is fixed based on screen size. The screen sizes include:
xs for extra small devices (used for less than 768 e.g smart phones, mobile etc.) sm for small screens (From 768 pixels and up e.g. tablets) md for the medium screen (>= 992 pixels. Desktops/Laptops) lg for large screens (>= 1200. Pixels e.g. large desktops)
The container-fluid class will take the full width of the viewport. If you use the container-fluid and resize the browser, you may notice the content inside it will adjust with every pixel to take the full available width.
By default, it will do nothing, as this is not a part of amp-story
.
This class comes from Twitter Bootstrap, so I've added the [twitter-bootstrap]
tag to your question. You would need to inline the Bootstrap CSS and not use the Bootstrap components or JavaScript. Since that would require inlining ~20kb of CSS, it would probably be more performant to write your own media queries.
Also, the way that amp-story
handles responsiveness is likely not compatible with Bootstrap, since the amp-story
desktop UI has multiple smaller "viewports" within the browser window, which Bootstrap would not understand.