Currently using justify-between to format spacing of my 3 navbar items: logo, links, and authentication btns. However, because the logo is so large, with the way justify-between works my links are not centered. How might I fix this?
Code (built using React and TailwindCSS):
<header
className={
"fixed flex flex-col lg:flex-row justify-between bg-white w-full p-4 lg:px-16 lg:items-center z-50"
}
>
<Logo />
<ul
className={`${
collapsed ? "hidden" : "block"
} list-none flex flex-col text-lg space-y-2 my-4 lg:space-y-0 lg:flex-row lg:space-x-8`}
>
<NavLink href={"/"} toggleNavbar={toggleNavbar}>
<IoIosCreate size={24} className={"mr-2"} />
<span className={""}>Create</span>
</NavLink>
<NavLink ... />
<NavLink ... />
{user && (
<NavLink ... />
)}
</ul>
<AuthenticationButtons/>
<ToggleNavbarButton/>
</header>