JSFiddle - React, Tailwind, and code Playground

by EZSlaver

HTML

<div class="header">
    <img class="left" src="http://www.w3schools.com/images/compatible_firefox.gif" />
    <div class="address">
        <div class="top">AND THIS IS THE NAME OF MY COMPANY I</div>
        <div class="bottom">123 Somewhere Boulevard, Here Around The World 123456</div>
    </div>
    <img class="right" src="http://www.w3schools.com/images/compatible_firefox.gif" />
</div>
<h1>Mainframe Support & Data Storage and Recovery</h1>
<h2>$title2</h2>

CSS

body {
    margin:12pt auto 12pt auto;
    width: 700px;
}

.header {
    position: relative;
    margin-top: 15px;
    height: 75px;
}

img {
    position: absolute;
    top: 0;
    width: 75px;
    height: 75px; 
}

img.left {
    left: 0;
    right: auto;
}

img.right {
    left: auto;
    right: 0;
}

.address {
    text-align:center;
    margin:15px auto;
    width: 500px;
}

.address > div
{
    clear: both;
    margin: 4px;
    font-weight: bold;
    font-size: 15px; 
}

.address > div.top {
    font-size: 20px; 
}

h1, h2 {
    text-align: center;
    font-weight: bold;
    font-style: oblique;
    margin: 5px auto;
    position: relative;
}

h1 { 
    font-size: 24pt;
}

h2 {
    font-size: 22pt;
}