Javascript DOM CSS Style borderLeftWidth Property

Introduction

Change the width of the left border of a <div> element to 10px:

document.getElementById("myDiv").style.borderLeftWidth = "10px";

View in separate window

<!DOCTYPE html>
<html>
<head>
<style>
#myDiv {/*  ww w.  j a  v a 2s.co  m*/
  border-style: solid;
}
</style>
</head>
<body>

<div id="myDiv">This is a div element.</div>
<br>
<button type="button" onclick="myFunction()">Change width of the left border</button>

<script>
function myFunction() {
  document.getElementById("myDiv").style.borderLeftWidth = "10px";
}
</script>

</body>
</html>

The borderLeftWidth property sets or gets the width of the left border of an element.

Property Values

Value	Description
thin	Defines a thin border
medium	Defines a medium border. `default`
thick	Defines a thick border
length	The width of the border in length units
initial	Sets this property to its default value.
inherit	Inherits this property from its parent element.

The borderLeftWidth property returns a String representing the width of an element's left border.

Previous Next