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 .