Trinchera WP
Regresar al curso Acceder Registrarse
Para acceder a este contenido:
Página Principal
Empresas

¡Obtén acceso a todos los cursos!

99
Acceso a todo

En esta clase, vamos a crear una sección para las empresas utilizando Tailwind CSS. El objetivo es centrar el contenido de forma automática y garantizar que, si en el futuro agregamos otro logo, no se desborde del contenedor.

Comenzamos duplicando un bloque existente y adaptándolo para mostrar las empresas. Este bloque tendrá un alto padding y un fondo de color rojo para probar. Posteriormente, centramos el texto dentro del contenedor.

Usamos un contenedor para evitar que el contenido se expanda más allá de los límites establecidos. En este caso, el contenedor se adapta a las imágenes de las empresas, como Volkswagen, y las organiza de manera flexible utilizando las clases flex y justify-center de Tailwind CSS.

Para mejorar el diseño, ajustamos el color de fondo a un tono más claro, como un gris, y el tamaño del texto se incrementa utilizando clases como text-gray-600. También agregamos márgenes para separar los elementos y darles un poco más de espacio.

Finalmente, duplicamos los elementos de la empresa para tener más ejemplos, ajustamos el padding y el color de fondo para que se vean bien en el diseño general.

Al finalizar esta sección, hemos logrado una apariencia sencilla pero efectiva, con todos los elementos alineados y bien espaciados, como se puede observar al comparar con el diseño original. La fuente y los márgenes se ajustan para lograr una presentación más precisa.

Con esta sección completada, podemos continuar con la siguiente, que incluirá más elementos y modificaciones. La estructura básica ya está lista, por lo que solo necesitaremos hacer algunos ajustes adicionales.