:right CSS Pseudo Class
Description
The CSS :right pseudo-class is used with the @page at-rule to select all right-hand pages of a printed document. Whether a given page is "left" or "right" is determined by the major writing direction of the document.
For example, if the first page of a document has a major writing direction of left-to-right, then it will be a :right page. If the first page has a major writing direction of right-to-left, then it will be a :left page.
The :right pseudo-class can only be used to style the margin, padding, border, and background properties of the page box.
Here is an example of how to use the :right pseudo-class:
@page {
:right {
margin-left: 2cm;
}
}
This will add a 2cm left margin to all right-hand pages of the document.
It is important to note that the
:right pseudo-class is not supported by all browsers and devices. It is generally recommended to use it in conjunction with other CSS features, such as media queries, to ensure that your document is styled correctly on all platforms.
Syntax
:right {
/* ... */
}
Example
No example, see css tab for code example.@page :right {
margin: 2in 3in;
}Browser Support
The following table will show you the current browser support for the CSS :right pseudo class.
| Desktop | |||||
 |
 |
 |
 |
 |
|
| 12 | 6 | x | 9.2 | 5 | |
| Tablets / Mobile | |||||
|
|
|
|
 |
 |
| 18 | x | 10.1 | 4.2 | 1 | 37 |
Last updated by CSSPortal on: 1st October 2023