1

I am trying to design email template. In a table, clicking on a row, more info shows up. Here is the fiddle: https://jsfiddle.net/0oyubtaL/

However, the problem is that mobile app of outlook doesnt support and the rows dont expand. I have converted to use inline CSS from using internal CSS - it didnt work. here is the fiddle: https://jsfiddle.net/y2dr7ags/

My question,

  1. Is there a way to make the :checked feature of checkbox as inline CSS in the above fiddle and make the expand table row feature work ?

    input[type=checkbox] {
      display: none;
    }

    input[type=checkbox]:checked+table {
      display: table;
      width: calc(100% - 20px);
    }
  1. Is there a way to achieve the same effect of collapsible table row using some simple HTML, CSS trick that would work in email templates ?

  2. Is there a way to make the whole row of a table an accordion ?

Many thanks.

jane
  • 211
  • 9
  • 30
  • 1
    This might help shed some light on your issue - https://stackoverflow.com/questions/10316715/html-form-in-email. Looks like you can't really use html form elements in an email. – Unbranded Manchester Sep 09 '22 at 09:20
  • Emails are extremely primitive. Major email clients (Gmail / Hotmail / others) as well as certain email hosts ( btinternet.com / others ) disable many standard HTML / CSS elements in emails, stemming from years of spam prevention. You should refocus your email on informing the reader and asking them to click a link to view the "form" (whatever it is) on an actual website/webpage. – Martin Sep 09 '22 at 09:28
  • Does this answer your question? [Html form in email](https://stackoverflow.com/questions/10316715/html-form-in-email) – Martin Sep 09 '22 at 09:28
  • https://stackoverflow.com/questions/10316715/html-form-in-email looks like a 10 year old post with not much info. Much has changed henceforth. Hence was trying to find a solution. Thanks for responding anyways. – jane Sep 09 '22 at 09:38
  • @jane sadly actually no, not much has changed at all, email clients and hosts are still not even using HTML5 reliably. As stated above, emails are extremely primitive. You may find some helpful guidance [here](https://stackoverflow.com/questions/4829254/best-practices-for-styling-html-emails) and [here](https://stackoverflow.com/questions/2229822/best-practices-considerations-when-writing-html-emails/21437734#21437734) as well as 3rd party help such as [here](https://css-tricks.com/using-css-in-html-emails-the-real-story/) – Martin Sep 09 '22 at 10:08
  • The answer is yes and no. Litmus had written an article 2yrs ago [found here](https://www.litmus.com/blog/the-ultimate-guide-to-interactive-forms-in-email/#simple-text-block-block_5ec62a2d6ebf4) which still works. The support is rather patchy but hey its emails. You can spend time fixing it for the best experience for some and a fall back for all others. Also if you want to search for a specific functionality, use this site: https://www.caniemail.com/ – Syfer Sep 12 '22 at 13:14

0 Answers0