Client Properties

<!DOCTYPE html>
<html>

<head>
	<title>
		HTML | DOM clientTop Property
	</title>
	<style>
		h1 {
			color: green;
			font-size: 35px;
		}
		
		#myid {
			height: 100px;
			width: 350px;
			padding: 20px;
			margin: 25px;
			border-left: 10px solid coral;
			border-top: 15px solid blue;
			background-color: green;
		}
	</style>
</head>

<body>
	<center>
		<h1>CloseTag</h1>
		<h2>DOM clientTop Property </h2>

		<div id="myid">
			<p style="color:white;font-size:25px;">
				CloseTag
			</p>
			<p id="sudo" style="color:white;"></p>
		</div>
		<button onclick="myfun()">Submit</button>
		<script>
			function myfun() {
				var w = document.getElementById("myid");   
                // Using clientTop property
                var x = "Border-Top-Width is: " 
                + w.clientTop + "px<br>";
                document.getElementById("sudo").innerHTML = x;
			}
		</script>

</body>

</html>