JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<html>
	<head>
		<meta charset='utf-8'>
   	 	<meta name="viewport" content="width=device-width">
	</head>
	<body>
		<div class="overall_container">
			<div class="svg_container"></div>

			<div class="scroll_container">

			<div class="player_wrapper">


						<div class="player_title">
								<h1>Babe Ruth</h1>
						</div>

						<div class="player_war">
								<h2>Wins Above Replacement: 50.8</h2>
						</div>

						<div class="picture">
							<img src="player_jpg/babe-ruth-2.jpg" alt="babe-ruth">
						</div>

						<div class="player_bio">
							<p>George Herman "Babe" Ruth Jr. (February 6, 1895 – August 16, 1948) was an American professional baseball player whose career in Major League Baseball (MLB) spanned 22 seasons,
							 from 1914 through 1935. Nicknamed "The Bambino" and "The Sultan of Swat",
							 he began his MLB career as a stellar left-handed
							  pitcher for the Boston Red Sox, but achieved his greatest fame
								as a slugging outfielder for the New York Yankees. Ruth is regarded as one
								 of the greatest sports heroes in American culture and is considered by many to
								 be the greatest baseball player of all time.</p>
						</div>

						<div class="stats">
								<h3>Runs: 145</h3>
								<h3>Hits: 145</h3>
								<h3>Home Runs: 145</h3>
								<h3>RBI: 145</h3>
								<h3>Stolen Bases: 145</h3>
								<h3>Batting Average: .345</h3>
						</div>

			</div> <!--player_wrapper -->

		 </div> <!--scroll_container -->

		</div>	 <!--overall_container -->

		<script src='bundle.js' type='text/javascript'></script>
	</body>
</html>

CSS

html,body,h1,h2,h3,h4,p,div{
  margin:0;
  padding:0;
}

html, body {
  height: 100%;
}

.overall_container {
  width: 100%;
  height: 100%;
  display: flex;
}

.svg_container {
  width: 75%;
  height: 100%;
  background: url(https://upload.wikimedia.org/wikipedia/commons/8/89/Baseball_diamond_clean.svg) blue;
  background-repeat: no-repeat;
  background-size: contain;
}

.scroll_container {
  width: 25%;
  height: 100%;
  background-color: 'red';
}

JavaScript

const svgBaseballField = document.getElementById('diamond');
  console.log(svgBaseballField);
  const svgContainer = document.getElementsByClassName('svg_container');
  console.log(svgContainer);

  svgBaseballField.setAttribute("width", "100%");
  svgBaseballField.setAttribute("height", "100%");

  svgBaseballField.setAttribute("viewBox", "0 0 100 100");