Hola!
En los productos rebajados, aparece una línea de tachado sobre el precio original. El problema que tengo, es que esa línea no está centrada, por alguna razón me aparece encima del precio y queda fatal. Esto me pasa tanto en la ficha del producto como en el listado de los productos. (adjunto imágenes)
¿Hay alguna manera de centrar dicha línea para que quede justo en medio del precio?
Muchas gracias!
Contenido solo visible a usuarios registrados
Hola Carlos.
Prueba añadir lo siguiente en Apariencia -> Personalizar -> CSS adicional
.price del {
text-decoration: underline;
text-underline-offset: -8px;
}
Un saludo
Hola Pepe!
Ahora la línea sale a la altura perfecta, pero curiosamente, se ve entrecortado, como si hubiera pasado detrás de la cifra.
Hola Carlos.
Ok, elimina el código anterior y prueba con este:
.price del{
text-decoration: underline 0.2em solid #ff5733!important;
text-decoration-skip-ink: none:
text-underline-offset: -8px;
}
Un saludo
Hola!
Ahora se ha ido abajo.
He pegado el código en personalizar/Css adicional y también, para probar, en el apartado para añadir CSS que trae el Theme Avada. Al pegarlo en Avada, la línea que te pongo abajo, aparecía con una x roja y un mensaje de error.
text-decoration-skip-ink: none:
En el mensaje de error decía esto: Unknoun property text-decoration-skip-ink: none: Expected RBRACE at line 80, col 31
Ni idea!
Hol Carlos.
Ufff perdón que puse : en vez de ; para cerrar una etiqueta.
El código es este:
.price del{
text-decoration: underline 0.2em solid #ff5733!important;
text-decoration-skip-ink: none;
text-underline-offset: -8px;
}
Un saludo
Sin problema Pepe, cosas que pasan 😉
Mira, he cambiado el color por uno gris, y sigue apareciendo detrás del número. Así ya se ve bastante mejor que al principio, pero si quedara delante ya sería la perfección.
Muchas gracias!
Hola Carlos
El problema es que se usa una decoración de texto y este estará por detrás, al utilizar la misma clase para el texto y la línea no se puede modificar su posición.
Puedes probar con esto pero no te aseguro que funcione:
.price del{
text-decoration: underline 0.2em solid #ff5733!important;
text-decoration-skip-ink: none;
text-underline-offset: -8px;
text-underline-position: above;
}
Un saludo
Perfecto Pepe! Así queda muy bien también.
Muchas gracias!
Un saludo!
Hola Carlos.
Genial !!! Me alegra que al final lo solucionaras.
Cualquier consulta que tengas no dudes en comunicarlo.
Un saludo