JSFiddle - React, Tailwind, and code Playground
by Justin
HTML
<!doctype html>
<html lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Mootsh</title>
<link href="https://fonts.googleapis.com/css?family=Belleza|Josefin+Sans|Libre+Baskerville" rel="stylesheet">
<style type="text/css">
@media only screen and (max-width: 768px){
#template_container, #template_body, #template_footer, #wrapper{
width:100% !important;
}
.mobile-full {
width: 100% !important;
display: block;
padding-bottom: 26px;
}
.templateColumnContainer{
display:block !important;
width:100% !important;
}
.columnImage{
height:auto !important;
max-width:480px !important;
width:100% !important;
}
.leftColumnContent{
font-size:16px !important;
line-height:125% !important;
}
.rightColumnContent{
font-size:16px !important;
line-height:125% !important;
}
}
html, body {
color: #212121;
}
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="background-color: #ffffff;">
<div id="wrapper" dir="ltr" style="background-color: #f6f5f2; margin: 0; width: 768px; margin: 0px auto; -webkit-text-size-adjust: none;">
<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
<tr>
<td align="center" valign="top">
<div id="template_header_image">
<table border="0" cellpadding="0" cellspacing="0" width="768" id="template_container" style="">
<tr>
<td align="center" valign="top">
<!-- Body -->
<table border="0" cellpadding="0" cellspacing="0" width="768" id="template_body">
<tr>
<td valign="top" id="body_content">
<!-- Content -->
<table border="0"...