Bootstrap 3 - Print layout and breaks after each grid column

Question

If you take this example (view it here: http://www.bootply.com/93816)

<div class="container">
  <div class="row">
    <div class="col-md-6">Column1</div>
    <div class="col-md-6">Column2</div>
  </div>
</div>

When you do a print preview of the generated page, it seems to cause the columns to stack/break (as if the float is removed) instead of displaying them in the usual grid layout.

I've had a look at the @media print sections of bootstrap.css and I can't see anything related to div that would cause that to happen.

Does anyone know how to avoid this?

Answer 1

Bojangles comment got me in the right direction, so I'll answer my own question.

Using the 'xs' size grid columns, which according to http://getbootstrap.com/css/#grid-options is for "Extra small devices Phones (<768px)", Bootstrap happily prints as expected.

<div class="container">
  <div class="row">
    <div class="col-xs-6">Column1</div>
    <div class="col-xs-6">Column2</div>
  </div>
</div>