Avisos
Vaciar todo

Hosting WordPress 70% dto Dominios promo

[Resuelto] Botón Responder en Comentario + Icono  

Página 1 / 2
 
Edwin R.
 Edwin R.
Usuario experto

Buenas tardes.

El Botón Responder en Comentario + Icono, en un articulo del blog, este no esta alineado al pasar al cursor cómo se muestra en la imagen, me podrían indicar la configuración o código para equipo de escritorio, table y celular.

Los demás están alineados.

Botón Responder en Comentario + Icono no alieados

 Gracias de ante mano.

Contenido solo visible a usuarios registrados

Respondido : 20/09/2023 1:54 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Edwin.

Prueba añadiendo lo siguiente en Apariencia -> Personalizar -> CSS Adicional:

.comment_area .comment-reply-link {
top: auto;
}

Tienes un Curso de CSS que te puede ayudar a identificar las clases y realizar las modificaciones de CSS que necesites, no es difícil y con las herramientas para desarrolladores del navegador te resultará muy fácil poder probar los resultados. Además de divertirte te ayudará a entender un poco más cómo funciona el lenguaje de diseño de CSS y asi realizar las modificaciones que necesites sin depender de terceros.

-> Curso de CSS en WordPress

 

Un saludo

Respondido : 20/09/2023 2:52 pm

Edwin R.
 Edwin R.
Usuario experto

@pepesoler, primero que todo gracias por responder. Pepe el código no funciono.

Respondido : 20/09/2023 3:18 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Edwin.

Antes de mandarte el codigo lo probe y vi qu efuncionaba bien, Puedes añadirle la etiqueta !important:

.comment_area .comment-reply-link {
top: auto!important;
}

 

Tienes la web en mantenimiento y no puedo revisarlo, si no funciona abre la web y lo revisamos.

 

Un Saludo

Respondido : 20/09/2023 3:56 pm

Edwin R.
 Edwin R.
Usuario experto

@pepesoler, te adjunto un clips, donde me explico mejor.

El botón responder comentario no esta alineado al icono, ya con el botón enviar comentario se había presentado lo mismo y esta solucionado.

Te agradezco.

Respondido : 20/09/2023 8:07 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Edwin, 

En este caso revisa si el siguiente código CSS te permite alinearlo como necesitas. 

.comment-body .et_pb_button:hover::after {
margin-top: 0px !important;
}

Un Saludo

 
Respondido : 20/09/2023 8:29 pm

Edwin R.
 Edwin R.
Usuario experto

@karen, disculpa, como quedaría para que no gire de abajo hacia la izquierda, dado que esta hace un giro. Sino que quedara de manera más sutil como el botón enviar comentario.

Te agradezco la colaboración.

Respondido : 20/09/2023 10:13 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Edwin, 

Prueba si el siguiente código CSS elimina esta animación

.et_pb_button:after, .et_pb_button:before {
position: relative;
margin-right: 0em;
}

Un saludo 

Respondido : 20/09/2023 11:01 pm

Edwin R.
 Edwin R.
Usuario experto

@karen, ahora sobresale espacio a la izquierda y afecta todos los botones. Te adjunto clip para explicarme mejor.

Te agradezco.

 

Respondido : 20/09/2023 11:44 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Edwin, 

Prueba si el siguiente código te permite corregir el espacio que necesitas

.et_pb_button:hover, .et_pb_module .et_pb_button:hover {
padding: 0.3em 0.7em 0.3em 0.7em;
}

Un saludo 

Respondido : 20/09/2023 11:57 pm

Edwin R.
 Edwin R.
Usuario experto

@karen, quedo como al comienzo de la pregunta, y ahora se salen todos los ICONO de los botones. 

Respondido : 21/09/2023 12:23 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Edwin

Por Favor abre la web para que podamos revisarlo, al tener la web cerrada no podemos realizar las pruebas que necesitamos.

 

Un saludo

Respondido : 21/09/2023 9:14 am

Edwin R.
 Edwin R.
Usuario experto

@pepesoler, disculpa pepe, la había puesto en mantenimiento dado que era muy tarde y como todavía no esta lista, trato de evitar rebote. Ya esta habilitada. 

Respondido : 21/09/2023 11:34 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Edwin.

Veo que el código que adjunte al principio funciona bien.

Elimina todos los códigos anteriores y añade los siguientes:

.comment_area .comment-reply-link {
top: auto!important;
}
body.et_button_custom_icon #page-container .et_pb_comments_0_tb_body.et_pb_comments_module .et_pb_button:after {
margin-top: initial!important;
}
.et_pb_button:hover, .et_pb_module .et_pb_button:hover {
padding: 0.3em 1.5em 0.3em 0.7em!important;
}

 

El resultado sera este:

 

Un Saludo

Respondido : 21/09/2023 12:13 pm

Edwin R.
 Edwin R.
Usuario experto

@pepesoler, pepe, gracias por tú paciencia, te comento que esta funcionando, pero se desconfiguro el botón enviar comentario.

Respondido : 21/09/2023 1:20 pm
Página 1 / 2