JSFiddle - React, Tailwind, and code Playground

by djp3d

HTML

<script src="https://vjs.zencdn.net/5.4.6/video.min.js"></script>
<link rel="stylesheet" href="https://vjs.zencdn.net/5.4.6/video-js.min.css">
<div class="videoParentDiv">
  
  <div class="videoDiv">
  
             <video id="video-player" class="video-js vjs-big-play-centered vjs-fluid" preload="auto" width="720" height="404" data-setup='{ "controls": true, "autoplay": true }'>
                    <%--<source src="http://wowzaprod102-i.akamaihd.net/hls/live/264435/986d71cd/playlist.m3u8" type='application/x-mpegURL' />--%>

                    <p class="vjs-no-js">
                        To view this video make sure you have JavaScript enabled, and consider upgrading to a web browser that
                        <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
                    </p>
                </video>
  
  
  
  </div>
  
  
  <div class="twitterDiv">

<a class="twitter-timeline" href="https://twitter.com/MDLZ?ref_src=twsrc%5Etfw">Tweets by MDLZ</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

  </div>


</div>

CSS

.videoParentDiv {

}

.twitterDiv {
  display: inline-block;
  width : 304px;
  height : 404px;
  overflow: hidden;
  overflow-y:scroll;
}

.videoDiv {
  display: inline-block;
  max-width : 720px;
  width: calc(100% - 314px);
  xheight : 404px;
  vertical-align: top;
}