diff --git a/bigbluebutton-html5/imports/ui/components/app/component.jsx b/bigbluebutton-html5/imports/ui/components/app/component.jsx
index 5b5d2e358176b37b846b8dc19179e816d3b280c2..afb33b17f6514d992fe5ace9e6cb3f57b9b98d03 100755
--- a/bigbluebutton-html5/imports/ui/components/app/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/app/component.jsx
@@ -206,13 +206,14 @@ class App extends Component {
 
   renderPanel() {
     const { enableResize } = this.state;
-    const { openPanel } = this.props;
+    const { openPanel, isRTL } = this.props;
 
     return (
       <PanelManager
         {...{
           openPanel,
           enableResize,
+          isRTL,
         }}
         shouldAriaHide={this.shouldAriaHide}
       />
diff --git a/bigbluebutton-html5/imports/ui/components/app/container.jsx b/bigbluebutton-html5/imports/ui/components/app/container.jsx
index 74c1b6220c471bbdd113ac58fd3a279010fe7915..99ffd87db307a8667ab6bd0b8a2c79b7f551f924 100755
--- a/bigbluebutton-html5/imports/ui/components/app/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/app/container.jsx
@@ -105,6 +105,7 @@ export default injectIntl(withModalMounter(withTracker(({ intl, baseControls })
     notify,
     validIOSVersion,
     isPhone: deviceInfo.type().isPhone,
+    isRTL: document.documentElement.getAttribute('dir') === 'rtl',
     meetingMuted: voiceProp.muteOnStart,
     currentUserEmoji: mapUser(currentUser).emoji,
     hasPublishedPoll: publishedPoll,
diff --git a/bigbluebutton-html5/imports/ui/components/panel-manager/component.jsx b/bigbluebutton-html5/imports/ui/components/panel-manager/component.jsx
index 20013f3f025714053c0c126e7b9a9ec57875d468..67765b60d7a02a0bcd73c2f41a4eb42f97c5cd24 100644
--- a/bigbluebutton-html5/imports/ui/components/panel-manager/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/panel-manager/component.jsx
@@ -124,12 +124,13 @@ class PanelManager extends PureComponent {
 
   renderUserListResizable() {
     const { userlistWidth } = this.state;
+    const { isRTL } = this.props;
 
     const resizableEnableOptions = {
       top: false,
-      right: true,
+      right: !isRTL,
       bottom: false,
-      left: false,
+      left: !!isRTL,
       topRight: false,
       bottomRight: false,
       bottomLeft: false,
@@ -172,12 +173,13 @@ class PanelManager extends PureComponent {
 
   renderChatResizable() {
     const { chatWidth } = this.state;
+    const { isRTL } = this.props;
 
     const resizableEnableOptions = {
       top: false,
-      right: true,
+      right: !isRTL,
       bottom: false,
-      left: false,
+      left: !!isRTL,
       topRight: false,
       bottomRight: false,
       bottomLeft: false,
@@ -220,12 +222,13 @@ class PanelManager extends PureComponent {
 
   renderNoteResizable() {
     const { noteWidth } = this.state;
+    const { isRTL } = this.props;
 
     const resizableEnableOptions = {
       top: false,
-      right: true,
+      right: !isRTL,
       bottom: false,
-      left: false,
+      left: !!isRTL,
       topRight: false,
       bottomRight: false,
       bottomLeft: false,
@@ -268,12 +271,13 @@ class PanelManager extends PureComponent {
 
   renderCaptionsResizable() {
     const { captionsWidth } = this.state;
+    const { isRTL } = this.props;
 
     const resizableEnableOptions = {
       top: false,
-      right: true,
+      right: !isRTL,
       bottom: false,
-      left: false,
+      left: !!isRTL,
       topRight: false,
       bottomRight: false,
       bottomLeft: false,
@@ -316,12 +320,13 @@ class PanelManager extends PureComponent {
 
   renderWaitingUsersPanelResizable() {
     const { waitingWidth } = this.state;
+    const { isRTL } = this.props;
 
     const resizableEnableOptions = {
       top: false,
-      right: true,
+      right: !isRTL,
       bottom: false,
-      left: false,
+      left: !!isRTL,
       topRight: false,
       bottomRight: false,
       bottomLeft: false,
@@ -366,12 +371,13 @@ class PanelManager extends PureComponent {
 
   renderPollResizable() {
     const { pollWidth } = this.state;
+    const { isRTL } = this.props;
 
     const resizableEnableOptions = {
       top: false,
-      right: true,
+      right: !isRTL,
       bottom: false,
-      left: false,
+      left: !!isRTL,
       topRight: false,
       bottomRight: false,
       bottomLeft: false,