History: Liquid-width section in page
Preview of version: 5
On this page only, the Bootstrap container div that's the middle area of the page is 100% wide [it overrides the default container width (1170px in large screens, etc.)], and it holds the three divs that are also 100% wide and have colored backgrounds; each of these holds a Bootstrap container div that reimposes the default width. This arrangement provides full-page-width color backgrounds, and is all responsive, etc.
The left column (in a two-column layout) is hidden to show this demonstration clearly.
The CSS rules for this page:
Copy to clipboard
{HTML(wiki="0")}<style> #middle.container {width: 100%;} .tiki .middle_outer {background: #28292b;} /* This is to add the dark background behind the wiki page icons (change language, etc.) */ .wide-container {background: #28292b; color: #fff;} .regular_1 {background: #f2f2f2; color: #333;} .regular_2 {background: #fff; color: #333;} #col1.col-md-9.col-md-push-3 {width: 100%; left: 0; } #col2 { display: none; } </style>{HTML}