JSFiddle - React, Tailwind, and code Playground

by Phillip

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<body>
  <nav class="navbar navbar-inverse navbar-fixed-top">
    <div class="container-fluid">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="/dashboard">Logo</a>
      </div>
      <div class="collapse navbar-collapse" id="myNavbar">
        <ul class="nav navbar-nav navbar-right">
          <li><a href="/dashboard">HOME</a></li>
          <li><a href="/dashboard">COMPANY LIST</a></li>
          <li><a href="/dashboard">COMPANY LIST</a></li>
          <li><a href="/contact.html">CONTACT</a></li>
          <li class="dropdown">
            <a class="dropdown-toggle" data-toggle="dropdown" href="#">MORE<span class="caret"></span></a>
            <ul class="dropdown-menu">
              <li><a href="#">Item 1</a></li>
              <li><a href="#">Item 2</a></li>
              <li><a href="#">Item 3</a></li>
            </ul>
          </li>

          <!--TODO: Add search functionality to search for company name and go directly to company page    -->
          <li><a href="#"><span class="glyphicon glyphicon-search"></span></a></li>

        </ul>
      </div>
    </div>
  </nav>

  <div class="content container">
    <div class="row">
      <div class="col-lg-12">





        <h1>Comapny Name</h1>

        <div class="row">
          <div class="col-lg-offset-1">
            
            
              <div...

CSS

.page-header{
    background-color: #000000;
    margin-top: 0;
    padding: 20px 20px 20px 40px;
}

.page-header h1, .page-header h1 a, .page-header h1 a:visited, .page-header h1 a:active {
    color:#ffffff;
    font-size: 36px;
    text-decoration: none;
}

.content {
    margin-left: 80px;
    margin-top: 80px;
}

h1,h2,h3,h4 {
    font-family: 'arial';
}

.top-menu, .top-menu:hover, .top-menu:visited {
    color: #ffffff;
    float: right;
    font-size: 26px;
    margin-right: 20px;
}
.col-head {
  font-size: 16
}