pseudoclases - ¿Cómo anulo CSS en un pseudo elemento?

pseudoclases css

Question

Sé que se me ha preguntado antes, pero no encuentro una forma clara de anular este CSS:

.ui-input-search:after {
content: "";
height: 18px;
left: 0.3125em;
margin-top: -9px;
opacity: 0.5;
position: absolute;
top: 50%;
width: 18px;
}

Debo dejar ui-input-search en el elemento, pero puedo agregar mi propia clase, como:

.ui-input-search-no-pseudo:after {
content: "";
}

Pregunta :
¿Hay alguna manera fácil de eliminar "pseudo-css" sin tener que sobreescribir el CSS línea por línea?

¡Gracias!

Answer 1

Aquí el content: ""; no afecta en absoluto si quiere eliminar ese pseudo tiene que usar content:none; eliminará el pseudo contenido agregado previamente.

Si eso no ayuda, también puedes probar:

display:none;
//or
display:none !important;

aquí está trabajando jsfiddle

https://jsfiddle.net/ganeshswami99/52duu0x8/1/

Answer 2

Por lo que puedo decir, no hay otra manera que anular todas las propiedades. Los estilos se definen en el elemento, no desaparecerán simplemente debido a otro selector que se dirige al elemento.

Si solo desea eliminar el pseudo elemento de la página, puede hacer content: none .