JSFiddle - React, Tailwind, and code Playground

by the_archer

HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Jarvis</title>
<link rel="stylesheet" href="style.css" />
<script src=""></script>
</head>
<body>

    <div id='header'>       
        <h1 id='title'>Jarvis</h1>
        <ul id='mainnav'>
            <li><a href="#">Hirvesh</a></li>
            <li><a href="#">Settings</a></li>
                <li><a href="#">Help</a></li>
        </ul>
    </div>
    <div id="content">
        <input id="newItem" type="text" name="newItem" />
    </div>
</body>
</html>

CSS

body {margin: 0.5em;}
#title{float:left;}
#mainnav{float:right;}
#mainnav li {display: inline;}
#header {padding-bottom: 1em;}
#newItem{width: 100%;}
#content{border-top: 1px solid black; padding-top: 1.5em; clear:both;}