Search code examples
htmlcsshtml-email

How to add cursor:pointer property to HTML email template, it's not working now

I'm working on email HTML template and thing which remains to me is adding cursor:pointer property to the button. Below is the part where I have a button:

<span style="
        display: block;
        text-align: center;
        justify-content: center;
        align-items: center;
      ">
      <button
        type="button"
        style="
          text-align: center;
          justify-self: center;
          border: 3px solid #ea2a46;
          color: #ea2a46;
          font-size: 16px;
          font-weight: 600;
          border-radius: 10px;
          background-color: #ffffff;
          padding: 10px 15px;
          cursor: pointer !important;
        "
      >
        Activate account
      </button>
    </span>

I tested both for type="button" and "submit".

Although in the code we can see that property cursor:pointer is added, this property is not visible in dev tools on the element, please check below: enter image description here

Can You please suggest how to fix it ?

Solution

  • It makes no sense to use a <button> in an email layout at all. Because you won't be able to send the form or process any js event. Instead, use an <a> tag that will have a cursor:pointer and add the necessary styles to it.