• Buenas,

    Estoy intentando poner el ancho completa en esta web, sin embargo se sigue quedando un borde en ambos lados.

    Ya he puesto ancho completo en Personalización>Global>Contenedor

    También he puesto el ancho completo en todos los contenedores de la página, y he puesto el margen 0 en todos los contenedores, pero algo me estoy dejando que aún se queda esa franja en ambos lados.

    Alguien sabría decirme por qué? Muchas gracias de antemano.

    La página con la que necesito ayuda: [accede para ver el enlace]

Viendo 6 respuestas - de la 1 a la 6 (de un total de 6)
  • Hola.

    Por lo que veo, la web está hecha con el tema Astra y Elementor.

    Hay un contenedor «general» que pone un padding a los lados de 20px y un ancho máximo de 1960px.

    .ast-container {
    max-width: 1960px;
    }

    .ast-container, .ast-container-fluid {
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
    }

    Poniendo esos padding a cero se elimina el espacio en blanco en los laterales.

    La clase «ast-container» pertenece a Astra. Mira en la configuración del tema. Seguramente allí puedas cambiar eso.

    Si no puedes o no lo encuentras, de momento puedes eliminar ese espacio escribiendo esta regla CSS, en el personalizador por ejemplo:

    .ast-container, .ast-container-fluid {
    padding-left: 0;
    padding-right: 0;
    }

    Saludos.

    Iniciador del debate arrancaquenosvamos

    (@arrancaquenosvamos)

    Muchas gracias por la ayuda.

    He puesto el código que me dijiste en el CSS personalizado, pero aún así, sigue sin verse el ancho completo.

    En la configuración de Astra el ancho máximo que puedes poner es 1960 y no encuentro otra forma de modificarlo.

    Hola.

    Seguramente el CSS del tema sigue prevaleciendo sobre la regla que has puesto.

    Aunque esto no es una buena práctica, de momento vamos a hacer uso del !important

    Pon esto en el personalizador a ver qué pasa:

    .ast-container, .ast-container-fluid {
    max-width: 100% !important;
    padding-left: 0x !important;
    padding-right: 0x !important;
    }

    Si después de esto sigue sin funcionar, tendría que ver el sitio «por dentro» para poder decirte más.

    Saludos.

    Iniciador del debate arrancaquenosvamos

    (@arrancaquenosvamos)

    He probado a usar el nuevo código haciendo uso del !important pero sigue sin funcionar. Qué más puede ser o dónde tengo que mirar a ver que es lo que falla?

    Muchas gracias por tu ayuda

    Iniciador del debate arrancaquenosvamos

    (@arrancaquenosvamos)

    Acabo de probar usando este código nombrando solo .ast-container y si me funciona.

    .ast-container {
    max-width: 100%!important;
    padding: 0;
    }

    Ahora la cuestión está… Se puede modificar esto en el tema sin tener que hacer uso del CSS adicional y sin hacer uso del !important ?

    Me acabo de dar cuenta de que escribí mal el padding del CSS de mi respuesta anterior 🙂

    Esta es una solución provisional. Tendrás que investigar en qué parte de la configuración de Astra se controla esto.

    Puede que en Ve a Apariencia > Personalizar > Global > Contenedor haya opciones para ello.

Viendo 6 respuestas - de la 1 a la 6 (de un total de 6)

Debes estar registrado para responder a este debate.