diff --git a/src/frontend/packages/lib_video/src/components/common/TeacherVideoInfoBar/index.tsx b/src/frontend/packages/lib_video/src/components/common/TeacherVideoInfoBar/index.tsx
index f0e0e2fa25..65e4bf6f2b 100644
--- a/src/frontend/packages/lib_video/src/components/common/TeacherVideoInfoBar/index.tsx
+++ b/src/frontend/packages/lib_video/src/components/common/TeacherVideoInfoBar/index.tsx
@@ -16,7 +16,7 @@ export const TeacherVideoInfoBar = ({
     <Box
       direction="column"
       justify="center"
-      style={{ flexBasis: '0%', minWidth: '0' }}
+      style={{ flex: 'auto' }}
       {...props}
     >
       <VideoInfoBar isTeacher startDate={startDate} />
diff --git a/src/frontend/packages/lib_video/src/components/common/VideoInfoBar/index.tsx b/src/frontend/packages/lib_video/src/components/common/VideoInfoBar/index.tsx
index a997fdb66c..484a11f00c 100644
--- a/src/frontend/packages/lib_video/src/components/common/VideoInfoBar/index.tsx
+++ b/src/frontend/packages/lib_video/src/components/common/VideoInfoBar/index.tsx
@@ -18,6 +18,17 @@ import { useUpdateVideo } from 'api/useUpdateVideo';
 import { useCurrentVideo } from 'hooks/useCurrentVideo';
 import { useParticipantsStore } from 'hooks/useParticipantsStore';
 
+const StyledBoxTextInput = styled(Box)`
+  & > div:first-child {
+    display: flex;
+    flex-direction: row-reverse;
+    width: 100%;
+    align-items: center;
+    justify-content: space-between;
+    gap: 0.5rem;
+  }
+`;
+
 const StyledTitleTextInput = styled(TextInput)`
   border: 1px solid ${normalizeColor('blue-active', theme)};
   border-radius: 4px;
@@ -134,19 +145,14 @@ export const VideoInfoBar = ({ isTeacher, startDate }: VideoInfoBarProps) => {
   return (
     <Fragment>
       {isTeacher ? (
-        <Box
-          margin={{ right: 'small' }}
-          gap="small"
-          alignContent="center"
-          direction="row"
-        >
+        <StyledBoxTextInput alignContent="center" direction="row">
           <StyledTitleTextInput
             icon={
               <EditionSVG
                 iconColor={normalizeColor('blue-chat', theme)}
                 width="25px"
                 height="25px"
-                containerStyle={{ margin: 'auto', marginRight: '8px' }}
+                containerStyle={{ margin: 'auto' }}
               />
             }
             onBlur={(event) => handleChange(event.target.value)}
@@ -156,8 +162,12 @@ export const VideoInfoBar = ({ isTeacher, startDate }: VideoInfoBarProps) => {
             value={title}
             plain
             reverse
+            width={{
+              min: '270px',
+              width: `100%`,
+            }}
           />
-        </Box>
+        </StyledBoxTextInput>
       ) : (
         <Heading
           a11yTitle={title}
@@ -172,28 +182,30 @@ export const VideoInfoBar = ({ isTeacher, startDate }: VideoInfoBarProps) => {
           {title}
         </Heading>
       )}
-      <Box direction="row">
-        {numberOfStudents > 0 && (
-          <Paragraph
-            color="blue-active"
-            margin={{ left: 'small', right: 'large', bottom: 'small' }}
-            size="small"
-          >
-            {intl.formatMessage(messages.nbViewers, {
-              numberOfStudents,
-            })}
-          </Paragraph>
-        )}
-        {localStartDate && (
-          <Paragraph
-            color="blue-active"
-            margin={{ right: 'large', bottom: 'small' }}
-            size="small"
-          >
-            {localStartDate}
-          </Paragraph>
-        )}
-      </Box>
+      {numberOfStudents > 0 || localStartDate ? (
+        <Box direction="row">
+          {numberOfStudents > 0 && (
+            <Paragraph
+              color="blue-active"
+              margin={{ left: 'small', right: 'large', bottom: 'small' }}
+              size="small"
+            >
+              {intl.formatMessage(messages.nbViewers, {
+                numberOfStudents,
+              })}
+            </Paragraph>
+          )}
+          {localStartDate && (
+            <Paragraph
+              color="blue-active"
+              margin={{ right: 'large', bottom: 'small' }}
+              size="small"
+            >
+              {localStartDate}
+            </Paragraph>
+          )}
+        </Box>
+      ) : null}
     </Fragment>
   );
 };
diff --git a/src/frontend/packages/lib_video/src/components/common/VideoLayout/index.tsx b/src/frontend/packages/lib_video/src/components/common/VideoLayout/index.tsx
index 3f84700864..e2177acc81 100644
--- a/src/frontend/packages/lib_video/src/components/common/VideoLayout/index.tsx
+++ b/src/frontend/packages/lib_video/src/components/common/VideoLayout/index.tsx
@@ -23,6 +23,10 @@ import { DisplayNameForm } from './DisplayNameForm';
 const StyledLiveVideoInformationBarWrapper = styled(Box)`
   -webkit-box-shadow: 0px 0px 7px 5px ${normalizeColor('shadow-1', theme)};
   box-shadow: 0px 0px 7px 5px ${normalizeColor('shadow-1', theme)};
+  flex-wrap: wrap;
+  gap: 1rem;
+  height: auto;
+  justify-content: space-evenly;
 `;
 
 interface LiveStudentLayoutProps {
diff --git a/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/TeacherLiveControlBar/index.tsx b/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/TeacherLiveControlBar/index.tsx
index a8750f11c4..b63b48f098 100644
--- a/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/TeacherLiveControlBar/index.tsx
+++ b/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/TeacherLiveControlBar/index.tsx
@@ -49,7 +49,12 @@ export const TeacherLiveControlBar = () => {
     };
   }, [video, isStarted, setIsStarted]);
 
-  return (
+  const isBoxToDisplay =
+    (isMobileView && availableItems.includes(LivePanelItem.CHAT)) ||
+    (isMobileView && availableItems.includes(LivePanelItem.VIEWERS_LIST)) ||
+    (video.live_type === LiveModeType.RAW && isStarted);
+
+  return isBoxToDisplay ? (
     <Box direction="row" height="100%">
       {isMobileView && availableItems.includes(LivePanelItem.CHAT) && (
         <Box height="100%" style={{ minWidth: '60px' }}>
@@ -69,5 +74,5 @@ export const TeacherLiveControlBar = () => {
         </Box>
       )}
     </Box>
-  );
+  ) : null;
 };
diff --git a/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/TeacherLiveLifecycleControls/index.tsx b/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/TeacherLiveLifecycleControls/index.tsx
index 8c0a290989..3a2e3e4861 100644
--- a/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/TeacherLiveLifecycleControls/index.tsx
+++ b/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/TeacherLiveLifecycleControls/index.tsx
@@ -118,7 +118,6 @@ export const TeacherLiveLifecycleControls = ({
   return (
     <Box
       direction="row"
-      style={{ flexBasis: '0%', whiteSpace: 'nowrap' }}
       margin={{ right: 'none', vertical: 'auto' }}
       {...props}
     >
diff --git a/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/index.tsx b/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/index.tsx
index 505dedb6f3..82169827a2 100644
--- a/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/index.tsx
+++ b/src/frontend/packages/lib_video/src/components/live/Teacher/Wrapper/Controls/index.tsx
@@ -19,7 +19,15 @@ export const Controls = ({
   return (
     <Fragment>
       {isLiveStarted && <TeacherLiveControlBar />}
-      <Box flex={isLiveStarted} direction="row" justify="end">
+      <Box
+        flex={isLiveStarted}
+        direction="row"
+        style={{ flex: '0' }}
+        justify="evenly"
+        width={{
+          min: 'auto',
+        }}
+      >
         <TeacherLiveRecordingActions isJitsiAdministrator={canStartLive} />
         <TeacherLiveLifecycleControls
           canStartStreaming={canShowStartButton}
diff --git a/src/frontend/packages/lib_video/src/components/vod/Teacher/Dashboard.tsx b/src/frontend/packages/lib_video/src/components/vod/Teacher/Dashboard.tsx
index 9c66a0ceb0..6c44dbecd5 100644
--- a/src/frontend/packages/lib_video/src/components/vod/Teacher/Dashboard.tsx
+++ b/src/frontend/packages/lib_video/src/components/vod/Teacher/Dashboard.tsx
@@ -34,6 +34,7 @@ const messages = defineMessages({
 const StyledLiveVideoInformationBarWrapper = styled(Box)`
   -webkit-box-shadow: 0px 0px 7px 5px ${normalizeColor('shadow-1', theme)};
   box-shadow: 0px 0px 7px 5px ${normalizeColor('shadow-1', theme)};
+  flex-wrap: wrap;
 `;
 
 interface DashboardProps {