JSFiddle - React, Tailwind, and code Playground

HTML

<html>

    <head>

    </head>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/document-register- 
    element/1.7.2/document-register-element.js"></script>
    <div id = "1">
    <style>
    div {
        height: 30px;
        width: 30px;
        background-color: brown;
    }
    </style>
     </div>

     <script>
      document.getElementById('1').attachShadow({mode: "open"})
    </script>
    <div id = "2"></div>
    <div id = "3"></div>
    </body>

    </html>