diff --git a/packages/docusaurus-theme-classic/src/theme/Footer/Layout/index.tsx b/packages/docusaurus-theme-classic/src/theme/Footer/Layout/index.tsx
index ae9c42b606..e22910596a 100644
--- a/packages/docusaurus-theme-classic/src/theme/Footer/Layout/index.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/Footer/Layout/index.tsx
@@ -21,7 +21,7 @@ export default function FooterLayout({
       className={clsx(ThemeClassNames.layout.footer.container, 'footer', {
         'footer--dark': style === 'dark',
       })}>
-      <div className="container container-fluid">
+      <div className="container container-fluid overflow-hidden">
         {links}
         {(logo || copyright) && (
           <div className="footer__bottom text--center">
diff --git a/packages/docusaurus-theme-classic/src/theme/Footer/Links/MultiColumn/index.tsx b/packages/docusaurus-theme-classic/src/theme/Footer/Links/MultiColumn/index.tsx
index 570ec44554..6aa8581457 100644
--- a/packages/docusaurus-theme-classic/src/theme/Footer/Links/MultiColumn/index.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/Footer/Links/MultiColumn/index.tsx
@@ -49,7 +49,7 @@ function Column({column}: {column: ColumnType}) {
 
 export default function FooterLinksMultiColumn({columns}: Props): ReactNode {
   return (
-    <div className="row footer__links">
+    <div className="row footer__links overflow-hidden">
       {columns.map((column, i) => (
         <Column key={i} column={column} />
       ))}
diff --git a/website/src/pages/styles.module.css b/website/src/pages/styles.module.css
index 051294057e..07d2428ae9 100644
--- a/website/src/pages/styles.module.css
+++ b/website/src/pages/styles.module.css
@@ -166,6 +166,7 @@ html[data-theme='dark'] .topBannerTitleText {
   flex-wrap: wrap;
   align-items: center;
   margin-top: 24px;
+  overflow: hidden;
 }
 
 .indexCtas a,