JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
    <title>Support Site </title>
    <link href="Styles/MasterStyle.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div id="wrapper">
        <div id="container">
            <div id="header">
                <div id="logo">
                    <img alt="logo" src="Images/Logo.bmp" />
                </div>
                <div id="titleInfo">
                    <a href="#">Admin XXXXXXXX Support Site</a>
                    <div id="signOut">
                        <a id="logOnStatus" class="signOut" >
                            Logout</a>
                    </div>
                </div>
                <div class="clear">
                </div>
            </div>
            <div id="centralContainer">
                <div id="leftNavContainer">
                    <div id="subContainerForLeftNav">
                        <div id="adminDiv">
                            <div class="backgroundButton" id="adminButton">
                                <p class="buttonText">
                                    The Admin</p>
                            </div>
                        </div>
                        <div class="clear">
                        </div>
                        <div id="vendorDiv">
                            <div class="menuTextHeading">
                                <a class="menuText">The Management</a>
                            </div>
                            <div class="buttonAlign">
                                <div class="backgroundButton" id="connectivityButton">
                                    <p class="buttonText">
                                        Test</p>
                                </div>
                                <div class="backgroundButton" id="vendorsButton">
                                    <p...

CSS

body
{
    margin: 0px;
    padding: 0px;
    text-align: center;
    background: Yellow;
}

#wrapper
{
    width: 100%;
    height: 70 px;
    text-align:left;
    margin: 0 auto;
    /*background: #FFBA31;*/
    background: #FFBA31;
}

#container
{
    width: 100%;
    height: auto;
    margin: 0 auto;
    background: white;
    
}

#header {
    background: none repeat scroll 0 0 white;
    border: 1px solid Red;
    height: 70px;
    margin-bottom: 20px;
    padding: 0 0 10px;
    width: 100%;
}

#titleInfo {
    border-bottom: 3px solid #FCDA55;
    color: #2377D1;
    float: right;
    font: bold 18pt Arial;
    height: 35px;
    margin: 10px 0 0 10px;
    overflow: hidden;
    padding: 10px 0 0;
    width: 55%;
}

#signOut
{
    font:bold 9pt Arial;
    float:right;
    border-bottom:none;
    padding: 0px 10px 0 0;
    margin: 0px 0px 30px 0;
    display:inline;
}



#logo {
    border: 1px solid orange;
    float: left;
    height: 32px;
    margin: 0 0 0 20px;
    padding: 10px 0 30px;
    width: 15%;
}

#centralContainer
{
    width: 100%;
    height:auto;
    margin: 0 auto;
    background: white;
}


/*Elements within centralContainer*/
#leftNavContainer {
    background: none repeat scroll 0 0 #CCCCCC;
    border: 1px solid Blue;
    float: left;
    height: 700px;
    margin: 0 0 0 10px;
    width: 20%;
}

#subContainerForLeftNav
{
   width: 190px; 
   height: auto;
   /*border:1px solid green;*/
   
}

#mainContainer {
    background: none repeat scroll 0 0 white;
    border: 1px solid Green;
    height: 700px;
    margin: 0 0 0 219px;
    width: 76%;
}

   


.menuText
{
    font:bold 13pt Arial;
    line-height:15pt;
    color:#00A6B5;
}

.menuTextHeading
{
    height:20px;
    border-bottom:3px solid #fcda55;
    padding:10px 0 10px 0;
    margin:0 0 10px 0;
}

.buttonAlign
{
    height:auto;
    width:auto;
    float: right;
    padding:0 0 0 0;
    margin:0 0 0 0;
}


.backgroundButton
{    
    width:150px;
    height:86px;
    display:...