❯
Tutorials References Exercises Certificates Search... Upgrade Get Certified
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY
CSS Tutorial
CSS HOME
CSS Introduction
CSS Syntax
CSS Selectors
CSS How To CSS Border Width
CSS Comments
CSS Errors ❮ Previous Next ❯
CSS Colors
CSS Backgrounds
CSS Borders
Borders
CSS Border Width
Border Width
The border-width property specifies the width of the four borders.
Border Color
Border Sides The width can be set as a specific size (in px, pt, cm, em, etc) or by using one of the three pre-defined
Border Shorthand values: thin, medium, or thick:
Rounded Borders
CSS Margins
CSS Padding Example
CSS Height/Width
CSS Box Model Demonstration of the different border widths:
CSS Outline p.one {
CSS Text border-style: solid;
CSS Fonts border-width: 5px;
CSS Icons }
CSS Links
CSS Lists p.two {
CSS Tables border-style: solid;
CSS Di l
CSS Display border-width: medium; ❯
Tutorials References } Exercises Certificates Upgrade Get Certified
HTML CSS JAVASCRIPT SQL PYTHON
p.three { JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY
border-style: dotted;
CSS Tutorial border-width: 2px;
}
CSS HOME
CSS Introduction
p.four {
CSS Syntax
border-style: dotted;
CSS Selectors border-width: thick;
CSS How To }
CSS Comments
CSS Errors Result:
CSS Colors COLOR
CSS Backgrounds
5px border-width
PICKER
CSS Borders
Borders
Border Width medium border-width
Border Color
Border Sides
Border Shorthand
2px border-width
Rounded Borders
CSS Margins thick border-width
CSS Padding
CSS Height/Width
CSS Box Model Try it Yourself »
CSS Outline
CSS Text
CSS Fonts
CSS Icons
CSS Links Specific Side Widths
CSS Lists
CSS Tables
CSS Di l
CSS Display
The border-width property can have from one to four values (for the top border, right border, bottom ❯
Tutorials References Exercises Certificates
border, and the left border):
Upgrade Get Certified
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY
CSS Tutorial Example
CSS HOME
p.one {
CSS Introduction border-style: solid;
CSS Syntax border-width: 5px 20px; /* 5px top and bottom, 20px on the sides */
CSS Selectors }
CSS How To
CSS Comments p.two {
border-style: solid;
CSS Errors
border-width: 20px 5px; /* 20px top and bottom, 5px on the sides */
CSS Colors }
CSS Backgrounds
CSS Borders p.three {
Borders border-style: solid;
Border Width border-width: 25px 10px 4px 35px; /* 25px top, 10px right, 4px bottom and 35px
Border Color left */
}
Border Sides
Border Shorthand
Rounded Borders Try it Yourself »
CSS Margins
CSS Padding
CSS Height/Width
CSS Box Model
CSS Outline ?
CSS Text
Exercise
CSS Fonts Which property is used to set the width of an element's border?
CSS Icons
CSS Links
border-style
CSS Lists
CSS Tables
CSS Di l
CSS Display
❯
Tutorials References
border-width
Exercises Certificates Upgrade Get Certified
HTML CSS JAVASCRIPT SQL border-color
PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY
border-radius
CSS Tutorial
CSS HOME
CSS Introduction Submit Answer »
CSS Syntax
CSS Selectors
CSS How To
CSS Comments
CSS Errors
CSS Colors ❮ Previous Next ❯
CSS Backgrounds
CSS Borders
Borders
Border Width
Border Color
Border Sides
Border Shorthand
Rounded Borders
CSS Margins
CSS Padding
CSS Height/Width
CSS Box Model
PLUS SPACES GET CERTIFIED FOR TEACHERS
CSS Outline
CSS Text
CSS Fonts
CSS Icons
FOR BUSINESS CONTACT US
CSS Links
CSS Lists
CSS Tables TopTutorials Top References Top Examples
CSS Di l
CSS Display HTML Tutorial HTML Reference HTML Examples
❯
Tutorials CSS Tutorial
References
JavaScript Tutorial
Exercises Certificates CSS Reference
JavaScript Reference
CSS Examples
Upgrade
JavaScript Examples
Get Certified
How To Tutorial SQL Reference How To Examples
HTML CSS SQL Tutorial SQL
JAVASCRIPT PYTHON JAVA PHP Python Reference
HOW TO W3.CSS C C++ C# SQL Examples
BOOTSTRAP REACT MYSQL JQUERY
Python Tutorial W3.CSS Reference Python Examples
W3.CSS Tutorial Bootstrap Reference W3.CSS Examples
Bootstrap Tutorial PHP Reference Bootstrap Examples
CSS Tutorial PHP Tutorial HTML Colors PHP Examples
Java Tutorial Java Reference Java Examples
CSS HOME C++ Tutorial Angular Reference XML Examples
CSS Introduction jQuery Tutorial jQuery Reference jQuery Examples
CSS Syntax Get Certified
CSS Selectors HTML Certificate
CSS Certificate
CSS How To
JavaScript Certificate
CSS Comments Front End Certificate
SQL Certificate
CSS Errors Python Certificate
PHP Certificate
CSS Colors Certificate
jQuery
CSS Backgrounds Java Certificate
C++ Certificate
CSS Borders C#
Certificate
XML Certificate
Borders
Border Width
Border Color
Border Sides FORUM ABOUT ACADEMY
Border Shorthand W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning.
Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness
Rounded Borders of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.
CSS Margins Copyright 1999-2025 by Refsnes Data. All Rights Reserved. W3Schools is Powered by W3.CSS.
CSS Padding
CSS Height/Width
CSS Box Model
CSS Outline
CSS Text
CSS Fonts
CSS Icons
CSS Links
CSS Lists
CSS Tables
CSS Di l