Soporte » Plugins y Hacks » WooCommerce » El mensaje de error en el carrito se superpone a los detalles del producto

  • Please help me where can I fix that the error message in the cart overlaps the product detail. You can see what I’m talking about here:
    https://www.loom.com/share/646eb8c215cb45548e9436deed927d36

    Please you can tell me what CSS I have to configure or where can I solved it.

    In CSS I have now the following: `
    /*linea de mensaje*/
    .woocommerce-cart .woocommerce-message{
    top: -80px;
    }

    .woocommerce-notices-wrapper{
    position:absolute;
    width:100%;
    }

    /*miniatura de imagen en carrito*/
    #add_payment_method table.cart img,
    .woocommerce-cart table.cart img,
    .woocommerce-checkout table.cart img
    {width: 60px;
    }

    /*configuración carrito 2 columnas hasta min pantalla 981px y 1 columna en ancho menor*/
    @media (min-width:981px){
    .woocommerce-cart .woocommerce{
    display: flex;
    }
    form.woocommerce-cart-form{
    flex: 1 0 70%;
    margin-right: 30px;
    }

    .woocommerce .cart-collaterals, .woocomerce-page .cart-collaterals{
    width: 30%;
    float: right;
    }

    /* Diseño columna total carrito*/
    .woocommerce .cart-collaterals .cart_totals, .woocommerce-page
    .cart-collaterals .cart_totals{
    float: none;
    width: 100%;
    border-radius: 10px;
    border: 0px solid;
    background: #c8c8c8c8;
    padding:10%;
    }
    }

    @media only screen and (max-width:360px) {
    .woocommerce-cart .actions button.button {
    width: 100% !important;
    }
    }

    /*cantidad carrito*/
    .woocommerce-page .quantity
    input.qty, .woocommerce .quatity
    input.qty{
    font-size: 15px !important;
    color:#003682 !important;
    height:50px;
    }

    /*botón actualizar carrito*/
    .woocommerce button.button:disabled[disabled],
    .woocommerce input.button:disabled[disabled] {
    padding: .3em 1em !important;
    }`

    • Este debate fue modificado hace 18 horas, 52 minutos por Jose Luis. Razón: Cambiar el título a español

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

Viendo 3 respuestas - de la 1 a la 3 (de un total de 3)
  • Moderador Jose Luis

    (@jose64)

    Hola.

    Bienvenido al foro de soporte de WordPress EN ESPAÑOL. Para hacer consultas en inglés debes ir al foro global, en https://wordpress.org/support/

    No encuentro como añadir un producto al carrito para reproducir el error y con un video o una captura de pantalla es imposible ver que clase es la que posiciona en mensaje. Lo que si es seguro es que el mal posicionado se debe al CSS adicional, haz la prueba eliminándolo.

    Quedamos a la espera de tus comentarios y, por favor, recuerda marcar el debate como resuelto cuando así sea, de esta forma nos ayudas a mantener el foro al día.

    Iniciador del debate varroyob

    (@varroyob)

    Estimado Jose Luis:

    Te paso otro video donde se ve que cuando un producto se agota el mensaje indicando que ya no está disponible el producto se pone sobre el detalle del carrito y no permite eliminar la línea del producto. He puesto inspeccionar para que puedas visualizar el nombre del componente y me puedas indicar qué configuración o código debo colocar para que no se monte este mensaje, pues no me permite eliminar el producto para poder continuar con cualquier otra compra. Gracias por tu ayuda.

    https://www.loom.com/share/8806332332014002ac94f532004dbf31

    Viviana

    Moderador Jose Luis

    (@jose64)

    Hola.

    Por lo que veo la clase es notices-cart-wrapper, pero sin probarlo no te puedo dar más detalles. Seguramente modificando la posición (seguramente se le añadió algún margen superior) lo soluciones.

Viendo 3 respuestas - de la 1 a la 3 (de un total de 3)
  • Debes estar registrado para responder a este debate.