Alguien con experiencia con media queries(css) en newsletters

[Guillermo Obregon]

Hola gente, estoy intentando armar un newsletter que en su versión movil hace un cambio de estructura bastante radical, me gustaria contar con la experiencia de alguno para saber si es posible implementar media queries (@media) en el html que envio, y si es posible cual es la forma o alguna guia que pueda usar.

He estado mirando guias como:

http://templates.mailchimp.com/development/responsive-email/responsive-captioned-images/

https://www.campaignmonitor.com/guides/mobile/coding/

Tambien he leido definiciones como:
@media screen and (min-width: 600px) {
            table[class="wrapper"] {
                width: 600px !important;
            }
Por el momento sigo haciendo pruebas.

saludos

@el_guiye

[Tordek]

Dependiendo de si ya tenés algo armado o recién estás empezando a armarlo, suele ser más fácil empezar con un framework, como Skeleton, Foundation, Bootstrap... los sistemas de grid prearmados te dejan hacer esto más fácil.

Además, Foundation, por ejemplo, incluye un par de SASS con las queries para los tamaños más comunes que te interesan.

http://foundation.zurb.com/docs/media-queries.html

--
Los mensajes en la lista no representan una opinión de ComunidadTIC sino del autor del mensaje.
 
Te invitamos a compartir tu experiencia, tu opinión, un artículo o noticia de interés, de actualidad o un caso de aplicación práctica, en todo lo relacionado con en el mundo de las TICs, participando en este espacio de encuentro e intercambio de ideas, información y conocimiento que es la ComunidadTIC.
 
Para Agregar a un Amigo pídele que ingrese a esta dirección: http://www.comunidadtic.com.ar/wp/lista-de-correo/
 
Participa también en el Sitio http://www.ComunidadTIC.com.ar/
 
Dudas, Consultas, Sugerencias, Quejas, propuesta de mejoras envié un email a: cont...@comunidadtic.com.ar
 
Para eliminar su suscripción envié un email a: comunidadit...@googlegroups.com
 
Moderadores de esta Lista: Guillermo O., Matias M.
---
Has recibido este mensaje porque estás suscrito al grupo "Comunidad TIC - Lista General" de Grupos de Google.
Para anular la suscripción a este grupo y dejar de recibir sus mensajes, envía un correo electrónico a comunidadit...@googlegroups.com.
Para ver esta conversación en el sitio web, visita https://groups.google.com/d/msgid/comunidadit/798b5af4-7772-4b03-9ad9-690838d47ae0%40googlegroups.com.
Para acceder a más opciones, visita https://groups.google.com/d/optout.

[Tordek]

Recién veo que lo querías para un email.

En SO mencionan que se puede, pero tenés un montón de limitaciones.

http://stackoverflow.com/questions/12050675/a-way-to-hide-tables-in-html-e-mail-in-inline-css-only-to-show-them-later-via#12059230

[Guillermo Obregón Ortiz]

Hola Tordek, gracias por el enlace, ya lo he visto.

Sigo leyendo y probando a ver si puedo implementar las media queries, ya que es como que no llega con el mail o al abrirlo solo puedo ver los estilos inline.

Gracias por el enlace y la colaboracion a mi pequeño problema.

Saludos

@el_guiye

Twitter: @el_guiye
Linkedin: gobregonortiz

Skype: guillermo.obregon

"Si el Presente es Lucha, el Futuro es Nuestro"

Para ver esta conversación en el sitio web, visita https://groups.google.com/d/msgid/comunidadit/CAKUXR6NMaWfOWYTpYMAbzsoaSaCnV8z9YAQxsmzC_ONY0p9o6Q%40mail.gmail.com.

[Tordek]

Puede entonces que te sirva algo por este camino

http://stackoverflow.com/questions/4894081/compile-css-into-html-as-inline-styles

Editás el CSS separado del HTML, pero usás una herramienta que te transforme todo en inline. Incluso Mailchimp te da una herramienta: http://templates.mailchimp.com/resources/inline-css/

Para ver esta conversación en el sitio web, visita https://groups.google.com/d/msgid/comunidadit/CAGKWxsRinvW7dX%2B73QS2yqGmwYk-2ano7t%2B-XMWP8-RK6u01xg%40mail.gmail.com.

[Guillermo Obregón Ortiz]

Ya intente usar la herramienta de mailchimp pero no se adapta al requerimiento que tengo, debo implementar si o si los media queries ya q mi estrctura cambia mucho de desktop a movil.

Para ver esta conversación en el sitio web, visita https://groups.google.com/d/msgid/comunidadit/CAKUXR6P7FKG%3DyZko0%3Df5He1TORfsSLoDsyUxYLbFU%2BHZ4VzNUQ%40mail.gmail.com.