CSS | border-top-width Property

The border-top-width property in CSS is used to set a specific width to the top border of an element. The border-top-style or border-style property is used for the element before using the border-top-width property.


border-top-width: length|thin|medium|thick|initial|inherit;

Property Values: The border-top-width property values are listed below:

  • length: It is used to set the width of the border. It does not takes negative value.
  • thin: It is used to set the thin border at the top of element.
  • medium: It is used to set medium sized top border. It is the default value.
  • thick: It is used to set the thick top border.
  • initial: It is used to set the border-top-width to its default value.
  • inherit: This property is inherited from its parent.






<!DOCTYPE html> 
            border-top-width property 
            #thin { 
                border-color: green; 
                border-top-style: solid; 
                border-top-width: thin; 
            #medium { 
                border-color: green; 
                border-top-style: solid; 
                border-top-width: medium; 
            #thick { 
                border-color: green; 
                border-top-style: solid; 
            #length { 
                border-color: green; 
                border-top-style: solid; 
                border-top-width: 20px; 
            #initial { 
                border-color: green; 
                border-top-style: solid; 
                border-top-width: initial; 
    <body style = "text-align:center"
        <h1 style = "color:green">GeeksforGeeks</h1
        <h3>border-top-width property</h3
        <div id="thin"
            border-top-width: thin; 
        <div id="medium"
            border-top-width: medium; 
        <div id="thick"
            border-top-width: thick; 
        <div id="length"
            border-top-width: length; 
        <div id="initial"
            border-top-width: initial; 



Browser Support: The browser supported by border-top-width property are listed below:

  • Google Chrome 1.0
  • Internet Explorer 4.0
  • Opera 3.5
  • Safari 1.0
  • Firefox 1.0

My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.