Seguramente has escuchando de media-screen o de flex para realizar responsive desing, pero tambien existe Bootstrap un framework con un sistema de grillas potente, esto permite crear contenedores, filas y columnas que puedes modificar el tamaño y la cantidad de columnas dependiendo el tamaño de tu pantalla.
Por defecto las columnas tienen un tamaño de 12 es decir ocupa toda la pantalla de ancho. veamos un ejemplo basico
<div class="container">
<div class="row">
<div class="col">
**//informacion**
</div>
</div>
</div>
Bootstrap proporciona archivos css y de javascrips asi que solo tenemos que importarlo en nuestra plantillas HTML para que funciones
los tamaños de pantalla se manejan con las clases xs, sm, md, lg, xl quiere decir en pantallas: muy pequeño, pequeño, mediano, largo, extra-largo
<div class="container">
<div class="row">
<div class="col-12 col-md-6 col-lg-3">
**//instrucciones**
</div>
</div>
</div>
Y muchísimas cosas puedes hacer con este framework, recuerda que utilizamos una libreria o framework para reducir el tiempo de desarrollo,
¿Para que escribirlo, si alguien ya lo escribo para nosotros? ahora implementarlos en tus proyectos.