2

I know how to use the CSS property "display: block" on an anchor to get it to make an entire cell clickable. However, this doesn't seem to work within an HTML email. Any ideas on how to get this to work in an email?

Thanks!

codeman
  • 8,868
  • 13
  • 50
  • 79
  • i would insert an transparent gif with the exact dimensions within the link. – ptriek Dec 13 '11 at 14:27
  • Im tring to avoid any images within the email. – codeman Dec 13 '11 at 14:45
  • Possible duplicate of [How can I make a link from a table cell](https://stackoverflow.com/questions/3337914/how-can-i-make-a-link-from-a-td-table-cell) – Veve Aug 17 '17 at 12:00

3 Answers3

0

I would put a TABLE element inside the anchor element, with width=100% and push the anchor out to fill its container from within.

Nicholas Shanks
  • 10,623
  • 4
  • 56
  • 80
0

Many email clients strip out css styles from the head and they don't work, so you have to use inline styles (ie putting <a style="display:block;"> etc).

Davos555
  • 1,974
  • 15
  • 23
  • seeing [this post](http://stackoverflow.com/questions/4013670/gmail-is-ignoring-displaynone) it might help to add !important ? – ptriek Dec 13 '11 at 15:00
0

Taken from this solution

display: block in the links works for everything but IE/Windows. If you give the block an explicit width of 100%, then IE/Windows plays along. But doing this creates problems with IE5/Mac and Netscape/Mozilla. So you have to use the child selector“>” to redefine the width to auto. Since IE/Windows doesn’t understand child selectors, it ignores the rule. IE5/Mac, Opera and Netscape/Mozilla follow the rule, and everyone is happy:

#yourdiv a {
        display: block;
        width: 100%;
        }

html>body #yourdiv a {
        width: auto;
        }
Yisela
  • 6,909
  • 5
  • 28
  • 51
  • are you using width/height values? I'm looking for alternatives, but that might be a problem... try adding them – Yisela Dec 13 '11 at 16:29