Publicado por Pierce Vollucci, Gerente adjunto de producto, Gmail, y Steve Bazyl, Ingeniero de programas de desarrolladores, Google Apps

Cuando envías mensajes de correo electrónico, tus destinatarios pueden leerlos en una computadora, una tablet, un teléfono o, lo que es más probable, los tres equipos. Sin embargo, el aspecto de tu mensaje podría ser diferente en estos dispositivos. Posteriormente, este mes, podrás usar consultas de medios de CSS con Gmail e Inbox by Gmail para garantizar que tus mensajes tengan el formato que desees, independientemente de que se visualicen en computadoras, teléfonos en el modo de retrato o tablets en el modo de paisaje. Podrás cambiar estilos según el ancho, la rotación y la resolución. Esto permitirá un ajuste de formato más receptivo para optimizar tu correo electrónico conforme a los dispositivos.


Ejemplo de un mensaje de correo electrónico antes y después de la aplicación de diseño receptivo.



En debates con diseñadores de correo electrónico, estas reglas de CSS admitidas se identificaron como las consultas de medios más útiles para el diseño receptivo. Este es solo un aspecto de un esfuerzo general orientado a expandir la compatibilidad con CSS en Gmail y brindar a los diseñadores de correo electrónico más control sobre la representación de sus mensajes. En el caso siguiente de CSS, por ejemplo, se aplica el color rojo cuando el ancho de la pantalla supera los 500 px. 
@media screen and (min-width: 500px) {
  .colored {
    color:red;
  }
}

Puedes encontrar la lista completa de reglas de CSS admitidas en la documentación para desarrolladores. Esperamos que esta referencia te ayude a crear mensajes de correo electrónico con más funciones y receptividad para los usuarios. ¡Suerte con el formateo!