diff --git a/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/breakout-room/component.jsx b/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/breakout-room/component.jsx
index 57eeb2d6f715c6aaf17e94d90cf5e7cfb23a2241..f00639a1320fd79f5918a41fd8f8c84b05665700 100644
--- a/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/breakout-room/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/breakout-room/component.jsx
@@ -26,12 +26,18 @@ const BreakoutRoomItem = ({
 }) => {
   if (hasBreakoutRoom) {
     return (
-      <div role="button" onClick={toggleBreakoutPanel}>
+      <div>
         <h2 className={styles.smallTitle}>
           {intl.formatMessage(intlMessages.breakoutTitle).toUpperCase()}
         </h2>
-        <div className={styles.BreakoutRoomsItem}>
-          <div className={styles.BreakoutRoomsContents}>
+        <div
+          role="button"
+          tabIndex={0}
+          onClick={toggleBreakoutPanel}
+          className={styles.BreakoutRoomsItem}
+          aria-label={intl.formatMessage(intlMessages.breakoutTitle)}
+        >
+          <div className={styles.BreakoutRoomsContents} aria-hidden>
             <div className={styles.BreakoutRoomsIcon}>
               <Icon iconName="rooms" />
             </div>
diff --git a/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/breakout-room/styles.scss b/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/breakout-room/styles.scss
index e66b3a9432b8f63c7a6b711593efc0ea3901189f..76c1e6543f030b2cfcecc27e159d453228d7abf1 100644
--- a/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/breakout-room/styles.scss
+++ b/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/breakout-room/styles.scss
@@ -40,6 +40,7 @@
 .BreakoutRoomsItem {
   @extend %list-item;
   margin-left: 0.375rem;
+  padding-left: var(--lg-padding-y);
 }
 
 .link {