JSFiddle - React, Tailwind, and code Playground
by DeaDrash
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>nav</title>
<style type="text/css">
#wrapper {
width: 1000px;
margin: 0 auto;
}
#wrapper:after {
content: '';
display: block;
clear: both;
}
#content {
width: 750px;
float: right;
}
#sidebar {
width: 250px;
float: left;
}
#sidebar h3 {
margin: 0 0 20px -9999px;
width: 100%;
padding: 0 0 0 9999px;
background: #ff0;
position: relative;
}
#sidebar .menu {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar .menu li {
width: 100%;
vertical-align: top;
}
#sidebar .menu a {
display: block;
width: 100%;
margin: 0 0 0 -9999px;
padding: 0 0 0 9999px;
background: #f0f;
position: relative;
}
#sidebar .menu a:hover {
background: #f00;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="content">
<p>Lorem ipsum dolor sit amet consectetuer velit Curabitur Proin condimentum congue. Ipsum tortor congue lacinia ante sollicitudin hac urna tellus dignissim ligula. Consectetuer sapien ut Ut amet dictumst Phasellus ac sed montes Vestibulum. Sapien Nullam lobortis nisl Donec magnis quis sed quis libero id. Vestibulum sem semper ac condimentum.</p>
</div>
<div id="sidebar">
<h3>Heading</h3>
...