Easy Tutorial
❮ Prop Option Disabled Prop Style Texttransform ❯

Style borderLeftWidth Property


Definition and Usage

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

Syntax

Set the borderLeftWidth property:

Return the borderLeftWidth property:

Value Description
thin Defines a thin border.
medium Default. Defines a medium border.
thick Defines a thick border.
length Defines the border width using units like px, cm, etc.
inherit The left border width is inherited from the parent element.

Browser Support

All major browsers support the borderLeftWidth property.

Note: IE7 and earlier versions do not support the "inherit" value. IE8 only supports "inherit" if the !DOCTYPE is specified. IE9 supports "inherit".


Example

Change the width of the left border:

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>tutorialpro.org(tutorialpro.org)</title> 
<style type="text/css">
#ex1{
    border: 1px solid #FF0000;
}
</style>
<script>
function displayResult(){
    document.getElementById("ex1").style.borderLeftWidth="thick";
}
</script>
</head>
<body>

<div id="ex1">This is some text.</div>
<br>
<button type="button" onclick="displayResult()">Modify the width of the left border</button>

</body>
</html>

❮ Prop Option Disabled Prop Style Texttransform ❯