Caution

JavaScript is disabled in your browser.
This site uses JavaScript for features such as search.
For the best experience, please enable JavaScript before browsing this site.

CSS Dictionary

Home
CSS Dictionary
border-right-style

border-right-style

Specifies the style of the right border.

Sample Code

div.test { border-right-style: solid;}
div.test1 { border-right-style: dashed;}
div.test2 { border-right-style: dotted;}

Available Values

Value	Description
none	No border is drawn and the width becomes 0. This is the initial value.
solid	The border is drawn as a single solid line.
dashed	The border is drawn as a dashed line with larger gaps.
dotted	The border is drawn as a dotted line with smaller gaps.
double	The border is drawn as two parallel lines.
groove	The border appears carved into the page. The opposite of 'ridge'.
ridge	The border appears raised from the page. The opposite of 'groove'.
inset	The border appears embedded into the page. The opposite of 'outset'.
outset	The border appears to pop out of the page. The opposite of 'inset'.

Browser Preview

<div style="border-right-style: solid; height: 100px; padding: 10px; font-weight: bold;">A div element with height 100px and padding 10px.</div>

Browser Compatibility

Desktop

Chrome

1+ ○

Firefox

1+ ○

Safari

1+ ○

Edge

12+ ○

Supported in all versions

11 ○

10 ○

9 ○

8 ○

7 ○

6 ○

Opera

9.2+ ○

8 and below ×

Mobile

iOS Safari

1+ ○

Android Browser

4.4+ ○

3 and below ×

Chrome Android

Latest ○

Same support as desktop

Firefox Android

Latest ○

Same support as desktop

※ Version information is based on MDN.

Overview

Specifies the style of the right border.

If no value is set for 'border-right-style', it defaults to 'none'. With 'none', the border width becomes 0 and no border is drawn. To display any border, you must set 'border-right-style' to a value other than 'none'.

If you find any errors or copyright issues, please contact us.

Home