JSFiddle - React, Tailwind, and code Playground

HTML

<div style = "height:150px;">
<div id="Someid" style=" overflow-x: hidden; overflow-y: auto;">
<svg  width="105">
<g transform="translate(10,5)">
		<text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
	<g transform="translate(10,20)">
		<text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
    <g transform="translate(10,35)">
    <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
	<g transform="translate(10,50)">
		<text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
    <g transform="translate(10,65)">
    <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
	<g transform="translate(10,80)">
		<text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
    
    <g transform="translate(10,95)">
    <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
	<g transform="translate(10,110)">
		<text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
    
    <g transform="translate(10,125)">
    <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
	<g transform="translate(10,140)">
		<text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
    
    <g transform="translate(10,155)">
    <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
	<g transform="translate(10,170)">
		<text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
    <g transform="translate(10,185)">
    <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
	<g transform="translate(10,200)">
		<text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>
	</g>
    </svg>
</div>
</div>