Cómo hacer un BOTÓN de Anchura Completa en DIVI

16/09/2023

Déjame adivinar, estás diseñando en tu página WordPress con el maravilloso tema DIVI instalado, y quieres hacer una cosa que no sabes exactamente cómo hacer: Hacer un Botón de Anchura Completa en Divi que ocupe el ancho completo de una caja.

No te preocupes más, aquí te voy a dar la solución sin muchas complicaciones, es muy sencillo.

Lo podrás hacer sin plugins y en menos de 10 segundos, lo que tardes en escribir un código CSS de una línea.

Haz tus botones de ancho completo en DIVI sin plugins

Lo primero que tendremos que realizar es poner un sencillo botón.

insertar boton divi

Habiendo hecho esto tendremos esto:

boton divi pequeño

Acto seguido hemos de proceder a modificar dicho botón por defecto de Divi:

modificar boton divi

En la configuración del módulo de botón Divi, vamos a ir en las pestañas de arriba a Avanzado y a CSS Personalizado, como se ve en la imagen:

ver css boton

Dentro del CSS personalizado de dentro de exactamente ese módulo, en Elemento principal

css elemento principal

escribiremos lo siguiente:

width: 100%;

Esto es un código CSS que viene a decir que ese módulo debe ocupar el 100% de la caja en la que está ubicado, ajustándose al máximo.

codigo css centrar boton

El resultado de nuestra actuación será este:

boton ampliado

¡Listo! Habremos ampliado nuestro botón en Divi.

Espero que te haya ayudado.

Si necesitas alguien que te eche un cable en tu proyecto tienes que saber que ofrezco un servicio de diseño web. ¡Consúltame y te ayudo encantado!

 

 

Roberto M
Consultor Experto en Marketing Digital especializado en SEO y Diseño Web. Impulsa tu negocio con estrategias efectivas y resultados comprobados. Maximiza tu presencia digital y alcanza tus metas aprovechando su experiencia.
¿Necesitas ayuda con tu proyecto?
¡Trabajemos juntos!

Estás a un email de distancia de multiplicar tu negocio.

Contáctame

Comparte este artículo

Artículos relacionados

Cómo Añadir Paginación al Blog de Divi

En mi experiencia como consultor de Diseño Web y de Posicionamiento SEO he podido ver uno de los talones de Aquiles de Divi, la forma de mostrar y previsualizar entradas en su blog. Y una de las cosas que más me frustraba ha sido ver que no hay forma humana de poner...

Cambiar el Orden de las Columnas SOLO en MOVIL (Divi + WordPress)

Conozco tu situación. Has diseñado una web que se ve genial en ordenador, con un efecto perfecto en la vista del usuario, sin embargo, cuando vas al teléfono, el orden no favorece a la navegación ni muestra el contenido como desearías, y no quieres tener que cambiar...