Navbar logo left to logo central

Community resources General
1

Hi Im very new here - am editing a premade site and I want to change the navbar logo left to make the navbar logo central can someone tell me how to do this?

2

Hi There,

Welcome to the community!

Can you provide site read-only link? I just want to see the elements structure to be sure.

3

https://preview.webflow.com/preview/georgiedickins-com?utm_medium=preview_link&utm_source=designer&utm_content=georgiedickins-com&preview=c7102920aa3b1ad0420f47b1dadc95bc&workflow=preview

4

To make sure that the logo will always be centered, we need to add a dummy element on the left. You currently have three elements within Navbar Wrapper: Navbar Brand (logo), Nav Menu Wrapper (navigation links), Menu button (hamburger icon). However, since the third element (Menu button) is hidden, the browser will read it as only two elements. Here’s how you can do it.

Summary
  1. Create a new div element within the ‘Navbar Wrapper’ and name it ‘Left Block’. Make it the top most element or just above ‘Navbar Brand’.
    image (5)
    image (5)1719×789 83.8 KB
  2. Set the width of each three element ‘Left Block’, ‘Navbar Brand’ and ‘Nav Menu Wrapper’ to 33.33%.
    image (6)
    image (6)759×729 112 KB
  3. Set the ‘Navbar Brand’ to display Flex and align both X and Y to Center
    image (7)
    image (7)238×733 28.4 KB

Please note that this solution only applies to desktop screens and you may need to change the structure of the layout should you need to enable ‘Menu button’ or add another element within the ‘Navbar Wrapper’.