Scroll Properties

<!DOCTYPE html>
<html>
	<head>
		<title>
			HTML DOM scrollWidth Property
		</title>
		<style>
			#box {
				width: 250px;
				overflow: auto;
			}
			
			#content {
				width: 500px;
				padding: 10px;
				background-color: green;
				color: white;
			}
		</style>
		
		<!-- script to find width of scroll -->
		<script>
			function myfun() {
				var doc = document.getElementById("content");
				var x = doc.scrollWidth;
				document.getElementById ("p").innerHTML
						= "Width: " + x + "px";
			}
		</script>
	</head>
	
	<body>
		<h1>Close Tag</h1>
		
		<h2>
			DOM scrollWidth Property
		</h2>
		
		<button onclick="myfun()">
			Click Here!
		</button>
		<br><br>
		
		<div id = "box">
			<div id = "content">
				Text content...
			</div>
		</div>
		
		<p id = "p"></p>
	</body>
</html>