JSFiddle - React, Tailwind, and code Playground
by alexcat
HTML
<!DOCTYPE html><html><head>
<meta name="viewport" content="width=device-width">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Simple Transactional Email</title>
</head>
<body style="background-color: #f6f6f6;font-family: sans-serif;-webkit-font-smoothing: antialiased;font-size: 14px;line-height: 1.4;margin: 0;padding: 0;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%">
<table border="0" cellpadding="0" cellspacing="0" class="body" style="border-collapse: separate;mso-table-lspace: 0pt;mso-table-rspace: 0pt;width: 100%;background-color: #f6f6f6">
<tbody><tr>
<td> </td>
<td class="container" style="font-family: sans-serif;font-size: 14px;vertical-align: top;display: block;Margin: 0 auto;max-width: 580px;padding: 10px;width: 580px">
<div class="content" style="box-sizing: border-box;display: block;Margin: 0 auto;max-width: 580px;padding: 10px">
<!-- START CENTERED WHITE CONTAINER -->
<table class="main" style="border-collapse: separate;mso-table-lspace: 0pt;mso-table-rspace: 0pt;width: 100%;background: #ffffff;border-radius: 3px">
<tbody><tr class="main_1">
<td class="wrapper" style="background-color: #FC7A7A;background: linear-gradient(to left, #fca368 0%, #fc679f 100%);font-family: sans-serif;font-size: 14px;vertical-align: top;box-sizing: border-box;padding: 15px;text-align: center">
<a style="font-family: 'Oswald', sans-serif;color: #ffffff;font-size: 20px;text-decoration: none;text-transform: uppercase">CHALLENGELY</a>
</td>
</tr>
<!-- START MAIN CONTENT AREA -->
<tr class="main_2">
<td class="wrapper" style="font-family: sans-serif;font-size: 14px;vertical-align: top;box-sizing: border-box;padding:...