border-right-width
Quick Summary for border-right-width
border-right-width CSS property sets the width of the right border of an element.
Code Usage for border-right-width
<pre class="brush: css notranslate"><code><span class="token comment">/ Keyword values /</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> thin<span class="token punctuation">;</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> medium<span class="token punctuation">;</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> thick<span class="token punctuation">;</span> <span class="token comment">/ <length> values /</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> 10em<span class="token punctuation">;</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> 3vmax<span class="token punctuation">;</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> 6px<span class="token punctuation">;</span> <span class="token comment">/ Global keywords /</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> inherit<span class="token punctuation">;</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> initial<span class="token punctuation">;</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> revert<span class="token punctuation">;</span> <span class="token property">border-right-width</span><span class="token punctuation">:</span> unset<span class="token punctuation">;</span> </code></pre>
More Details for border-right-width
border-right-width
The border-right-width CSS property sets the width of the right border of an element.
Syntax
/* Keyword values */ border-right-width: thin; border-right-width: medium; border-right-width: thick; /* <length> values */ border-right-width: 10em; border-right-width: 3vmax; border-right-width: 6px; /* Global keywords */ border-right-width: inherit; border-right-width: initial; border-right-width: revert; border-right-width: unset; Values
<line-width> Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:
thin medium thick Note: Because the specification doesn't define the exact thickness denoted by each keyword, the precise result when using one of them is implementation-specific. Nevertheless, they always follow the pattern thin ≤ medium ≤ thick, and the values are constant within a single document.
Formal definition
| Initial value | medium |
|---|---|
| Applies to | all elements. It also applies to ::first-letter. |
| Inherited | no |
| Computed value | the absolute length or 0 if border-right-style is none or hidden |
| Animation type | a length |
Formal syntax
<line-width>where
<line-width> = <length> | thin | medium | thick
Examples
Comparing border widths
HTML<div>Element 1</div> <div>Element 2</div> div { border: 1px solid red; margin: 1em 0; } div:nth-child(1) { border-right-width: thick; } div:nth-child(2) { border-right-width: 2em; } Specifications
| Specification |
|---|
| CSS Backgrounds and Borders Module Level 4 # the-border-width |
See also
The other border-width-related CSS properties:border-bottom-width, border-left-width, border-top-width, and border-width. The other border-right-related CSS properties: border, border-right, border-right-style, and border-right-color. Last modified: Aug 12, 2021, by MDN contributors
Select your preferred language English (US)DeutschFrançais日本語한국어Polski中文 (简体) Change languageAdd Comment
Other Items in CSS
Related Search Terms
Other Categories in CSS
Random Quote
James Clear
