JSFiddle - React, Tailwind, and code Playground

HTML

<div class="holder">
            <div>
                <pre id="lines">
            </pre>
            </div>
            <div>
                <pre id="code">
                .aaa {
                   bbb
                }
                .ccc {
                   ddd
                }
                </pre>
            </div>
        </div>

CSS

#code {
        line-height: 15px;
    }
    .holder {
        display: flex
    }

JavaScript

const codeHeight = document.getElementById('code').offsetHeight;    
    const lines = Math.ceil(codeHeight / 15);
    let html = '';
    for (i = 1; i < lines; i++) {
        html += i + '<br>'
    }
    document.getElementById('lines').innerHTML = html;