diff --git a/src/components/navbar/NavSection.jsx b/src/components/navbar/NavSection.jsx
index e725220a2..3a254a2ec 100644
--- a/src/components/navbar/NavSection.jsx
+++ b/src/components/navbar/NavSection.jsx
@@ -1,3 +1,4 @@
+import { Box } from "@chakra-ui/react"
 import { Button, IconButton } from "@opengovsg/design-system-react"
 import PropTypes from "prop-types"
 import { useState, useRef } from "react"
@@ -269,7 +270,7 @@ const NavSection = ({
           </div>
         )}
       </Droppable>
-      <div className="d-flex justify-content-between mt-4">
+      <Box mt="2rem" mb="1rem">
         <Select
           ref={selectInputRef}
           className="w-50"
@@ -278,6 +279,7 @@ const NavSection = ({
           options={sectionCreationOptions}
         />
         <Button
+          mt="1rem"
           onClick={sectionCreationHandler}
           isDisabled={!newSectionType}
           variant="solid"
@@ -285,7 +287,7 @@ const NavSection = ({
         >
           Create New Menu
         </Button>
-      </div>
+      </Box>
       <span className={elementStyles.info}>
         {`Note: you can specify a folder ${
           hasResourceRoom ? `or resource room ` : ``
diff --git a/src/templates/NavBar.jsx b/src/templates/NavBar.jsx
index 17b238d78..80d322bcb 100644
--- a/src/templates/NavBar.jsx
+++ b/src/templates/NavBar.jsx
@@ -15,9 +15,10 @@ const NavDropdownSection = ({ children, link }) => (
 
 const TemplateNavBar = ({ links, collectionInfo, resources }) => (
   <nav className="navbar is-transparent flex-fill">
-    <div className="bp-container">
+    <div className="bp-container is-flex">
       <div className="bp-container is-fluid margin--none navbar-menu h-100">
         <div className="navbar-start">
+          <div className="navbar-item sub-link" />
           {links.map((link, linkIndex) => {
             if (link.collection) {
               return (