W3cubDocs

/CSS

-moz-orient

Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

The -moz-orient CSS property specifies the orientation of the element to which it's applied.

Initial value	`inline`
Applies to	any element; it has an effect on `progress` and `meter`, but not on <input type="range"> or other elements
Inherited	no
Media	visual
Computed value	as specified
Animation type	discrete
Canonical order	the unique non-ambiguous order defined by the formal grammar

Syntax

The -moz-orient property is specified as one of the keyword values chosen from the list below.

Values

inline: The element is rendered in the same direction as the axis of the text: horizontally for horizontal writing modes, vertically for vertical writing modes.
block: The element is rendered orthogonally to the axis of the text: vertically for horizontal writing modes, horizontal for vertical writing modes.
horizontal: The element is rendered horizontally.
vertical: The element is rendered vertically.

Formal syntax

inline | block | horizontal | vertical

Examples

HTML

<p>
  The following progress meter 
  is horizontal (the default):
</p>
<progress max="100" value="75"></progress>

<p>
 The following progress meter
 is vertical:
</p>
<progress class="vert" max="100" value="75"></progress>

CSS

.vert {
  -moz-orient: vertical;
  width: 16px;
  height: 150px;
}

Result

Specifications

Though submitted to the W3C, with positive initial feedback, this property is not yet part of any specification; currently, this is a Mozilla-specific extension (that is, -moz-orient).

Browser compatibilityUpdate compatibility data on GitHub

	Desktop
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari
Basic support	No	No	6	No	No	No
`auto` value	No	No	21 — 40 21 — 40 The `auto` value was equivalent to `horizontal`.	No	No	No
`inline` and `block` values	No	No	40	No	No	No

	Mobile
	Android webview	Chrome for Android	Edge Mobile	Firefox for Android	Opera for Android	iOS Safari	Samsung Internet
Basic support	No	No	No	6	No	No	No
`auto` value	No	No	No	21 — 40 21 — 40 The `auto` value was equivalent to `horizontal`.	No	No	No
`inline` and `block` values	No	No	No	40	No	No	No