¿Cómo puedo eliminar el selector ::after CSS que se añade automáticamente a the_content()?

Question

¿Cómo puedo eliminar el selector ::after CSS que se añade automáticamente a the_content()?

13 mar 2019, 13:51:50

Vistas: 18K

Votos: 0

Tengo un CPT (Custom Post Type) que muestra valores meta después de the_content() en el frontend, y este selector ::after está afectando mi diseño. El selector siempre aparece justo después del último elemento dentro de the_content().

bogdan

103

css

Todas las respuestas a la pregunta

Comentarios

¡Gracias por tu respuesta! El problema era porque añadí una clase CSS para agregar una letra capitular a un párrafo en el_content. Estaba confundido sobre de dónde venía el selector ::after ya que no lo definí, pero content: none; solucionó el problema.

bogdan

13 mar 2019 14:32:31

Jacob Peattie 43.9K · Accepted Answer · 2019-03-13T14:00:01Z

No tiene nada que ver con the_content().

::after es un pseudo-elemento que se añade con CSS. Ten en cuenta que el elemento ::after en las herramientas de desarrollo solo está ahí para ayudar en el desarrollo. No existe en el código fuente HTML.

Por lo tanto, el CSS de tu tema debe estar añadiéndolo al elemento que envuelve the_content() en tu plantilla. Puedes eliminarlo estableciendo content: none; en el selector correspondiente. Por ejemplo, si el elemento que envuelve tu contenido es <div class="entry-content">, entonces el CSS para eliminarlo podría ser:

.entry-content::after {
    content: none;
}

Sin embargo, las reglas de especificidad siguen aplicándose, por lo que el selector que uses para eliminarlo debe ser más específico que el que lo añadió.

También ten en cuenta que tu tema probablemente hace esto por una razón. Comúnmente, elementos como este se utilizan para limpiar flotantes y evitar que el contenido alineado con flotantes, como imágenes, se salga del elemento padre.