# Resolver estilos finales en notificaciones por correo electrónico

**URL:** <https://meta.discourse.org/t/resolve-final-styles-in-email-notifications/310219>\
**Category:** Feature\
**Tags:** email, pr-welcome, css\
**Created:** [1 Junio, 2024 23:09 UTC](https://meta.discourse.org/t/resolve-final-styles-in-email-notifications/310219 "2024-06-01T23:09:19Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![thoka](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/thoka/32/115652_2.png) [@thoka](https://meta.discourse.org/u/thoka)\
**Post date:** [1 Junio, 2024 23:09 UTC](https://meta.discourse.org/t/resolve-final-styles-in-email-notifications/310219/1 "2024-06-01T23:09:19Z")

</div>

Al menos el cliente de correo electrónico web de [posteo.de](http://posteo.de) renderiza los colores con el primer valor dado en una definición de estilo CSS, lo que da como resultado botones ilegibles en las notificaciones:

![image](https://cdck-file-uploads-global.s3.dualstack.us-west-2.amazonaws.com/meta/original/4X/a/3/1/a3113ffcb27e16be22f88ee25aee33ec1b9dd5e4.png)

en lugar de

![Esta imagen muestra una barra rectangular azul con texto blanco que parecen ser instrucciones en alemán sobre cómo responder a un correo electrónico, con las palabras alemanas "Rufe das Thema auf oder antworte auf diese E-Mail, um zu antworten." (Subtitulado por IA)](https://cdck-file-uploads-global.s3.dualstack.us-west-2.amazonaws.com/meta/original/4X/d/f/0/df096fd41cdc30fcbbc9a3526d022482d7265d05.png)

Actualmente, el estilo correspondiente es

 

```css
font-weight: normal;; text-decoration: none; font-weight: bold; color: #006699;; background-color: #2F70AC; color: #FFFFFF; border-top: 4px solid #2F70AC; border-right: 6px solid #2F70AC; border-bottom: 4px solid #2F70AC; border-left: 6px solid #2F70AC; display: inline-block; font-weight: bold;

```

 

Si se cambia para incluir solo las definiciones más recientes

 

```css
font-weight: normal; text-decoration: none; font-weight: bold; background-color: #2F70AC; color: #FFFFFF; border-top: 4px solid #2F70AC; border-right: 6px solid #2F70AC; border-bottom: 4px solid #2F70AC; border-left: 6px solid #2F70AC; display: inline-block; font-weight: bold;

```

 

se obtiene el comportamiento deseado.

Dado que no hay ningún beneficio en enviar estilos sobrescritos posteriormente, los problemas de renderizado con visores de correo electrónico defectuosos podrían resolverse enviando solo las definiciones CSS finales.

---

_[View the full topic](https://meta.discourse.org/t/resolve-final-styles-in-email-notifications/310219)._