diff --git a/stylesheets/components/MessageAudio.scss b/stylesheets/components/MessageAudio.scss
index 3d6a7c60b0..0cde8fd0c7 100644
--- a/stylesheets/components/MessageAudio.scss
+++ b/stylesheets/components/MessageAudio.scss
@@ -9,6 +9,12 @@ $audio-attachment-button-margin-small: 4px;
   display: flex;
   flex-direction: column;
   margin-top: 2px;
+  /**
+   * Players for audio or video content should always be left-to-right.
+   * This overrides the default direction of the surrounding elements.
+   */
+  /* stylelint-disable-next-line declaration-property-value-disallowed-list */
+  direction: ltr;
 
   .PlaybackButton {
     @media (min-width: 0px) and (max-width: 799px) {