diff --git a/components/core/Navbar/Navbar.module.css b/components/core/Navbar/Navbar.module.css
index 5db900503..2b1ff03a6 100644
--- a/components/core/Navbar/Navbar.module.css
+++ b/components/core/Navbar/Navbar.module.css
@@ -1,4 +1,7 @@
 .root {
+}
+
+.container {
   @apply flex justify-between items-center flex-row px-6 h-20 relative;
 }
 
diff --git a/components/core/Navbar/Navbar.tsx b/components/core/Navbar/Navbar.tsx
index 71e28e3b7..1447a9f38 100644
--- a/components/core/Navbar/Navbar.tsx
+++ b/components/core/Navbar/Navbar.tsx
@@ -12,22 +12,26 @@ interface Props {
 const Navbar: FC<Props> = ({ className }) => {
   const rootClassName = cn(s.root, className)
   return (
-    <Container className={rootClassName}>
-      <Link href="/">
-        <span className="inline-block cursor-pointer">
-          <Logo />
-        </span>
-      </Link>
-      <div className="flex flex-row h-full content-center flex-1 ml-10">
-        <nav className="hidden flex-row items-center px-6 lg:flex space-x-4">
-          <a className={s.link}>All</a>
-          <a className={s.link}>Clothes</a>
-          <a className={s.link}>Accesories</a>
-        </nav>
-        <Searchbar />
-      </div>
-      <UserNav />
-    </Container>
+    <div className={rootClassName}>
+      <Container>
+        <div className={s.container}>
+          <Link href="/">
+            <span className="flex-0 cursor-pointer">
+              <Logo />
+            </span>
+          </Link>
+          <div className="flex flex-row h-full content-center flex-1 ml-10">
+            <nav className="hidden flex-row items-center px-6 lg:flex space-x-4">
+              <a className={s.link}>All</a>
+              <a className={s.link}>Clothes</a>
+              <a className={s.link}>Accesories</a>
+            </nav>
+            <Searchbar />
+          </div>
+          <UserNav />
+        </div>
+      </Container>
+    </div>
   )
 }