JSFiddle - React, Tailwind, and code Playground

by Glynne Turner

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <div class="container">
    <h1>Example</h1>
    <p>This is a demonstration of how to use full-width background while keeping the regular .container grid.</p>
  </div>
  <div class="specialBackground">
    <div class="container">
      <h2>Section 2</h2>
      <p>Some not too long text not too long text not too long text not too long text not too long text not too long text not too long text not too long text.</p>
    </div>
  </div>
  <div class="container">
    <h2>Section 3</h2>
    <p>Some not too long text not too long text not too long text not too long text not too long text not too long text not too long text not too long text.</p>
    <h3>Section 3.1</h3>
    <p>Some very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text.</p>
  </div>

CSS

.specialBackground{
  background-color: gold;
  /* replace with your own background settings */
}

JavaScript

\