El problema reside en las clases de grilla que estás usando para tus columnas. Estás usando `col-xs`, que no funciona para Bootstrap 4. La versión 4.0, que estás ocupando, tiene opciones de grilla diferentes a las de la versión 3.x. Bootstrap 4 no cuenta con las clases `col-xs-` que tiene la versión 3.x para las pantallas de menor tamaño, pero sí cuenta con las clases `col-`, que cumplen el mismo propósito. Eso si, debes tomar en cuenta, que las opciones de grilla tienen rangos de anchos de pantallas distintos entre versión y versión (solo pongo los dos rangos más pequeños, por ser los pertinentes para esta pregunta): ### Bootstrap 4.0 - `col-`: Pantallas bajo 576px - `col-sm`: Pantallas entre 576px y 767px ### Bootstrap 3.x - `col-xs-`: Pantallas bajo 768px - `col-sm-`: Pantallas entre 768px y 991px ## Solución Si tu versión de Bootstrap es 4.0, basta con reemplazar las clases `col-xs-` de tus columnas de la última fila, por las clases `col-`. En este caso, `col-xs-4` por `col-4`: <div class="col-4" style="background-color:#aaa"> <h1>Columna 1</h1> <p>Prueba de Bootstrap</p> </div> Tu fila quedaría así: <div class="row"> <div class="col-4" style="background-color:#aaa"> <h1>Columna 1</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-4" style="background-color:#bbb"> <h1> Columna 2</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-4" style="background-color:#ccc"> <h1>Columna 3</h1> <p>Prueba de Bootstrap</p> </div> </div> ## Código completo El código completo quedaría así: <div class="container"> <div class="row"> <div class="col-lg-4" style="background-color:#aaa"> <h1>Columna 1</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-lg-4" style="background-color:#bbb"> <h1>Columna 2</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-lg-4" style="background-color:#ccc"> <h1>Columna 3</h1> <p>Prueba de Bootstrap</p> </div> </div> <hr> <div class="row"> <div class="col-md-4" style="background-color:#aaa"> <h1>Columna 1</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-md-4" style="background-color:#bbb"> <h1>Columna 2</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-md-4" style="background-color:#ccc"> <h1>Columna 3</h1> <p>Prueba de Bootstrap</p> </div> </div> <hr> <div class="row"> <div class="col-sm-4" style="background-color:#aaa"> <h1>Columna 1</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-sm-4" style="background-color:#bbb"> <h1> Columna 2</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-sm-4" style="background-color:#ccc"> <h1>Columna 3</h1> <p>Prueba de Bootstrap</p> </div> </div> <hr> <div class="row"> <div class="col-4" style="background-color:#aaa"> <h1>Columna 1</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-4" style="background-color:#bbb"> <h1> Columna 2</h1> <p>Prueba de Bootstrap</p> </div> <div class="col-4" style="background-color:#ccc"> <h1>Columna 3</h1> <p>Prueba de Bootstrap</p> </div> </div> </div> Y [aquí][1] lo puedes ver en acción. ## Véase también - [Bootstrap 4: Grid options (Opciones de grilla)][2] - [Bootstrap 3.3: Grid system (Sistema de grilla)][3] [1]: https://jsfiddle.net/CrisMVP3200/1esg7mnt/1/ [2]: http://getbootstrap.com/docs/4.0/layout/grid/#grid-options [3]: https://getbootstrap.com/docs/3.3/css/#grid