JSFiddle - React, Tailwind, and code Playground
HTML
<head>
<style type="text/css">
/*General Implementations*/
html, body
{
background: #6CF;
width: 100%;
height: 100%;
}
/*Main Elements*/
/*Black bar on the far left side*/
#blackbar
{
background: #000;
height: 55px;
position: absolute;
top: 25px; /*width: 155px;*/
width: 15%;
}
/*Red bar containing red part image of logo*/
#redbar
{
background: #C0272D;
width: 114px;
height: 80px;
float: left;
}
#redbar img
{
float: right;
position: relative;
top: 24px;
}
/*Wrapper containing main content, navigation, white bar w/ logo, news feed, and main content*/
#wrapper
{
width: 798px;
min-height: 100%;
float: left;
position: relative;
left: 15%; /*left: 155px;*/
}
/*Navigation wrapper containing white bar w/ logo and main navigation*/
#navigationWrapper
{
width: 570px;
height: 130px;
position: relative;
top: 0;
float: left;
font-size: 12px;
font-family: 'RobotoLight' , Arial, sans-serif;
text-transform: uppercase;
}
/*Main navigation settings*/
#navigationWrapper ul
{
/*position: relative;
top: 0;
float: right;*/
height: 24px;
width: 570px;
}
#navigationWrapper ul li
{
display: inline-block;
width: 114px; /*height: 22px;*/
text-align: right;
float: right;
padding: 3px 0 0 0;
}
#navigationWrapper ul li:hover
{
border-top:...