CSS voice-balance Property

Description

The voice-balance property refers to the balance between left and right channels, and presumes a two channel (stereo) model that is widely supported on consumer audio equipment.

Initial value
center
Applies to
All elements
Inherited
Yes
Media
Speech
Computed value
The specified value resolved to a [number] between '-100' and '100' (inclusive)
Animatable
No
CSS Version
CSS3
JavaScript syntax
object.style.voiceBalance

Syntax

voice-balance: <number> | left | center | right | leftwards | rightwards 

Values

  • <number>A number between '-100' and '100' (inclusive).
  • leftSame as '-100'.
  • centerSame as '0'.
  • rightSame as '100'.
  • leftwardsMoves the sound to the left, by subtracting 20 from the inherited 'voice-balance' value, and by clamping the resulting number to '-100'.
  • rightwardsMoves the sound to the right, by adding 20 to the inherited 'voice-balance' value, and by clamping the resulting number to '100'.
  • inherit

Example

.class {
   voice-balance: right; 
}

Browser Support

Desktop
Explorer Edge Chrome Firefox Opera Safari
??????
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
??????