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,
- 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);
}
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 ?
Is there a way to make the whole row of a table an accordion ?
Many thanks.