JSFiddle - React, Tailwind, and code Playground

by Chris Vitalos

HTML

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf8" />
    </head>
    <body smarttemplateinserted="true">
        <div id="smartTemplate4-template">
            <div id="PreHeader" class="PreHeader"><p></p></div>
            <div id="replacePostBody" class="PostBody"></div>
            <div class="PostFooter">
                <hr />
                <table class="PostFooter">
                    <tbody>
                        <tr>
                            <td>
                            <p class="PostFooter"><a id="replaceBlogPostURL" class="PostFooter" alt="Click here to view in browser" href="https://blog.srrpnj.org">View in browser</a></p>
                            <p class="PostFooter">Learn more by visiting our <a class="PostFooter" alt="Click here to go to our website" href="https://srrpnj.org">website</a> and <a class="PostFooter" alt="Click here to go to our blog" href="https://blog.srrpnj.org">blog</a>.</p>
                            </td>
                        </tr>
                    </tbody>
                </table>
                <hr />
            </div>
        </div>
    </body>
</html>

CSS

* {
    font-size: 14px;
    font-family: 'Open Sans',Verdana,sans-serif;
}
div {
  margin: 0 auto 0 auto;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Merriweather',Georgia,serif;
}
h1 {
    font-size: 1.5rem;
}
h2 {
    font-size: 1.33rem;
}
h3,
h4,
h5,
h6 {
    font-size: 1.25rem;
}
img {
    width: 100%;
    height: auto;
    display: block;
}
a:link {
    color: #00e;
}
a:visited {
    color: #551a8b;
}
.PostBody,
.PostFooter {
    max-width: 720px;
    margin: 0 auto 0 auto;
}
.PostFooter {
    text-decoration: none; /* Removes the underline from links */
    color: #000; /* Sets the link color, can be adjusted as needed */
    font-family: 'Open Sans', sans-serif; /* Ensures consistency in font */
    font-size: 0.875rem; /* Consistent font sizing for links */
    padding: 0;
}
table.PostFooter {
    width: 100%; /* Ensures the table stretches to the width of its container */
}
p.PostFooter {
    margin: 0.25rem auto 0 auto;
    text-align: center;
}
figure.tmblr-full {
    margin: 0;
    padding: 0;
}
.PreHeader {
    display: none;
    overflow: hidden;
}