JSFiddle - React, Tailwind, and code Playground

by clime

HTML

<script src="https://rawgithub.com/dimsemenov/Magnific-Popup/master/dist/jquery.magnific-popup.js"></script>
<link rel="stylesheet" href="https://rawgithub.com/dimsemenov/Magnific-Popup/master/dist/magnific-popup.css">
<link rel="stylesheet" href="https://rawgithub.com/ivaynberg/select2/master/select2.css">
<script src="https://rawgithub.com/ivaynberg/select2/master/select2.js"></script>
<a href="#test-popup" class="open-popup-link">Show inline popup</a>

<div id="test-popup" class="white-popup mfp-hide">
    <select id="focus-blur-loop-select">
        <option>hello</option>
        <option>world</option>
	</select>
</div>

CSS

.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
}

JavaScript

$('.open-popup-link').magnificPopup({
  type:'inline',
  midClick: true
});

$('#focus-blur-loop-select').select2({
    width: '200px'
});