JSFiddle - React, Tailwind, and code Playground

by Arvind Pal

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css">
<script src="https://fonts.googleapis.com/icon?family=Material+Icons"></script>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/js/materialize.min.js"></script>
<body><ul id="dropdown1" class="dropdown-content">
  <li> <a class="tooltipped" data-position="left" data-delay="50" data-tooltip="Facebook data">Facebook</a></li>
  <li><a class="tooltipped" data-position="left" data-delay="50" data-tooltip="Twitter data">Twitter</a></li>
  <li><a class="tooltipped" data-position="left" data-delay="50" data-tooltip="Youtube data">YouTube</a></li>
  <li class="divider"></li>
  <li><a class="tooltipped" data-position="left" data-delay="50" data-tooltip="Overall Buzz">Overall</a></li>
</ul>

<ul id="boxoffice" class="dropdown-content">
  <li><a class="tooltipped" data-position="left" data-delay="50" data-tooltip="First Week Collection">First Week</a></li>
  <li><a class="tooltipped" data-position="left" data-delay="50" data-tooltip="First Month Collection">First Month</a></li> 
  <li class="divider"></li>
  <li><a class="tooltipped" data-position="bottom" data-delay="50" data-tooltip="Overall Collection">Overall</a></li>
</ul>
    <ul id="makers" class="dropdown-content">
        <li><a>Produce :</a></li>
        <li><a>Director :</a></li>
        <li><a>Actor :</a></li>
        <li><a>Actress :</a></li>
        <li><a>Co-Actors :</a></li>
    </ul>
<nav>
            

  <div class="nav-wrapper">
    <a href="#!" class="brand-logo">Logo</a>

        
    <ul class="right hide-on-med-and-down">
        <li>        <div class="input-field">
          <input id="search" type="search" required>
          <label for="search"><i class="large material-icons">search</i></label>
          <i class="material-icons">close</i>
        </div></li>
      <li><a href="sass.html"...

CSS

.movieName{
    text-align:center;
    font-weight:bold;
    font-size:30px;
}

.poster{
    background-color:#5384CF;
    height:200px;
    width:160px;
    margin-left:10px;
    float:left;
}

div img {
    width:160px;
}
.movieInfo{
    height:500px;
    width:80%;
    margin-left:171px;
    background-color:#A3C8FF;
 
    
}