15
Sto provando a creare una e-mail reattiva: in realtà sta funzionando molto bene su tutta la linea, ad eccezione di alcuni piccoli pezzi che non cooperano in Gmail per Android.Le tabelle di larghezza 100% non funzionano in Gmail Android
ho questi seriamente semplici strisce nere che si trovano nella parte superiore del messaggio di posta elettronica come elemento decorativo:
<table width="100%" cellpadding="0" cellspacing="0" align="center" valign="top">
<tr><td width="100%" height="11" bgcolor="#000000"></td></tr>
<tr><td width="100%" height="2" bgcolor="#FFFFFF"></td></tr>
<tr><td width="100%" height="1" bgcolor="#000000"></td></tr>
<tr><td width="100%" height="30" bgcolor="#FFFFFF"></td></tr>
</table>
Eppure essi non vengono visualizzati come qualcosa di più di una piccola striscia di bianco e nero che assomiglia un punto esclamativo ultrasottile nell'app Gmail per Android.
Allo stesso modo, v'è un piè di pagina che non è che abbracciano l'intera larghezza della mail:
<table width="100%" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#000000">
<tr>
<td>
<table width="650" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#000000">
<tr>
<td align="right" class="footer">
<img src="images/footer.png" />
</td>
</tr>
</table>
</td>
</tr>
</table>
Tutti i suggerimenti su come rendere questi coprono l'intera larghezza della posta elettronica?
@Fabio HTML5 non è certamente supportato in client di posta elettronica. Per le e-mail, sfortunatamente, la migliore pratica è usare il codice "gravemente deprecato". http://stackoverflow.com/questions/2935472/html-email-tables-or-divs – rds
Se non hai trovato una soluzione prova style = "width: 100%! important" come
@JoeyPhillips Questo ha funzionato per me! Ti meriti credito per la risposta corretta. La chiave è in realtà l'aggiunta! Importante per la dichiarazione di larghezza all'interno dell'attributo di stile. Grazie per aver condiviso questo. –
risposta
Se non hai trovato una soluzione provare
style = "width:! 100% importanti" come
Gmail ama mettere a nudo la maggior parte della CSS, ma se si aggiunge un'etichetta ! importante li terremo la maggior parte del tempo.
fonte
2014-09-26 20:09:06 JoeyPhillips
Questo dovrebbe essere contrassegnato come la risposta giusta! Era ancora un altro di quei fastidiosi problemi che non riuscivo a rintracciare, ma questo lo risolve! –
Questo mi ha frustrato per la scorsa settimana. Vorrei che Gmail risolvesse questo problema! Grazie! –
Ha smesso di funzionare? Gmail sta ridimensionando automaticamente le mie tabelle sul client Android ma offre l'opzione per disabilitare il ridimensionamento automatico, che risolve il problema ... – MatheusJardimB
Non ho familiarità con la creazione di client/siti/etc per tutto ciò che non è progettato per PC, quindi non sono sicuro che funzionerà o meno, ma provate a farlo.
Anche se si perde la funzione di elemento di "tavolo", questo è un esempio di esempio ho fornito, facendo del mio meglio per matchup le impostazioni del colore e dimensione per le decorazioni di linea.
fonte
2014-09-24 14:15:12
Dopo numerosi test la soluzione come segue funzionerà per qualsiasi problema di spaziatura verticale tra tutti i client di posta elettronica (disponibile su Litmus), incl. App Gmail su Andriod.
Punto chiave è quello di applicare
width:100% !important
al tavolo, non funzionerà su come applicare altd
. Questa è anche la soluzione migliore per la sostituzione di immagini spaziali verticali.fonte
2015-02-17 04:10:39 Mark
source
fonte
2015-09-25 09:32:57 insulaner
Questo funziona nel mio caso. È quindi possibile aggiungere min-width: 0 all'interno di una query multimediale per rimuovere questa regola per i client di posta elettronica che supportano le query multimediali. – jarace87
Questo era il pezzo mancante per il mio problema! Nella mia causa, stavo cercando di creare un modello di e-mail a larghezza fissa che fosse sempre 580px, ma Gmail lo avrebbe trasformato in una tabella di larghezza fluida. Aggiunta di 'width: 580px! Important; min-width: 580px! Important;' era ciò di cui aveva bisogno. Saluti! –
Problemi correlati