JSFiddle - React, Tailwind, and code Playground
HTML
<div class="app-header"></div>
<div class="main">
<div class="subheader">
<div class="project-menu">
<h2 class="subheader-project-name"> </h2>
<h3 class="subheader-component-name"> </h3>
</div>
</div>
<div class="section">
<table>
<tr>
<td class="td">
<div class="section-body details-body">
<div class="inputs"></div>
<div class="assoc">
<ul class="tabs">
<li class="tab active">Tab 1</li>
<li class="tab">Tab 2</li>
</ul>
<div class="tab-area"></div>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
CSS
/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
/**
* 1. Set default font family to sans-serif.
* 2. Prevent iOS text size adjust after orientation change, without disabling
* user zoom.
*/
html {
font-family: sans-serif;
/* 1 */
-ms-text-size-adjust: 100%;
/* 2 */
-webkit-text-size-adjust: 100%;
/* 2 */
}
/**
* Remove default margin.
*/
body {
margin: 0;
}
/* HTML5 display definitions
========================================================================== */
/**
* Correct `block` display not defined in IE 8/9.
*/
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
display: block;
}
/**
* 1. Correct `inline-block` display not defined in IE 8/9.
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
*/
audio, canvas, progress, video {
display: inline-block;
/* 1 */
vertical-align: baseline;
/* 2 */
}
/**
* Prevent modern browsers from displaying `audio` without controls.
* Remove excess height in iOS 5 devices.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Address `[hidden]` styling not present in IE 8/9.
* Hide the `template` element in IE, Safari, and Firefox < 22.
*/
[hidden], template {
display: none;
}
/* Links
========================================================================== */
/**
* Remove the gray background color from active links in IE 10.
*/
a {
background: transparent;
}
/**
* Improve readability when focused and also mouse hovered in all browsers.
*/
a:active, a:hover {
outline: 0;
}
/* Text-level semantics
========================================================================== */
/**
* Address styling not present in IE 8/9, Safari 5, and Chrome.
*/
abbr[title] {
border-bottom: 1px dotted;
}
/**
* Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
*/
b, strong {
font-weight: bold;
}
/**
* Address...