title: Bootstrap 4 - keep columns with static width and no wrapping
body: <p>I am trying to get this layout working: Columns keep constant width when I resize the browser and they dont wrap - instead a horizontal scroll bar appears as soon as it reaches the min width. My code:</p>
  
  <pre><code>&lt;div class="card card-outline-primary" style="min-width:500px"&gt;
  &lt;div class="card-block container-fixed"&gt;
      &lt;form class="row"&gt;
          &lt;div class="col-4" style="border:solid;border-color:red;border-width:5px;min-width:250px"&gt;
              &lt;label for="visualTheme" class="control-label"&gt;1234&lt;/label&gt;
              &lt;div&gt;
                  &lt;input class="form-control" style="height:30px;width:200px" id="visualTheme" /&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="col-4" style="border:solid;border-color:blue;border-width:5px;min-width:250px"&gt;
              &lt;label class="control-label"&gt;5678&lt;/label&gt;
              &lt;div&gt;
                  &lt;input class="form-control" style="height:30px;width:200px" id="startingScreen" /&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="col-4" style="border:solid;border-color:green;border-width:5px;min-width:250px"&gt;
  
          &lt;/div&gt;
       &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And Fiddle:
  <a href="https://jsfiddle.net/qnuogLgk/" rel="noreferrer">Fiddle</a></p>
  
  <p>If I use min width for columns they wrap.</p>
  
  <p>Thanks for the help.</p>