Hi guys, I’m trying to separate the components in my NavBar where everything is separated nicely. Example Brand logo at the left of screen, nav menu in the middle and the cart is at the right. Any help ? Thanks! Here is my share-link below.
Looks like you figured it out, and the way you did it works nicely, flex parent with justify between and three children will accomplish this.
Thanks man! Only thing is I’m not sure if the nav menu looks as centered as it should be. Looks a little bit off…but I could just be losing it lol idk
You should be able to remove the top and bottom padding and vertically center it exactly using the align items center, you may need to fix the height on the children of the flex parent when you do this, but that is a more reliable method usually than adding padding values.
Well not centered vertically but instead horizontally
The logo takes up 260px vs the cart taking up 81px which will result in some unevenness, you could manually set the cart width or shrink your logo a bit.
Oh thanks! I got it. It’s centered now. Thanks man!