I’m having trouble with the shopping cart.
The cart sits in the top nav menu and I’d like to keep it that way.
It looks fine in the designer (on desktop) but gets cut off in the preview and in the published version.
The Cart Wrapper can’t be changed – I tried to change pretty much any other cart-related element.
Taking the cart out of the nav bar didn’t help, and it’s not an option anyway.
I am glad it worked out for you @Rapha , just a quick tip, you are supposed to select the answer as a solution and not your own comment so the right post gets highlighted as the solution.
Hey imtiazraqib,
I’m happy that it worked out too – except that, anything below that container (which is pretty much everything), is now disabled and not clickable anymore. So basically the whole site is disabled.
If that’s the trade-off, I can’t use your solution.
(just to prevent confusion:
I have two nav elements, one for desktop and the other for tablet and mobile.
There are other elements with altered z-indexes on the page)
Hey @Rapha , I did however find a workaround for you and PM’d you, not sure if you received it but it keeps your animations and everything still works. I will link it here for you to take a look at:
Here are the changes I had to make for it to finally work. Since your Navigation is fixed, a lot of issues that arise are due to this reason and essentially we have to work around that.
Change your nav’s position to fixed-top as you had it before but change it’s z-index to 2. In order to change the nav’s z-index, you have to go the selector and select nav, NOT navdesktop.
Change your OIC-container’s position to fixed-top as well with z-index to 2. Put all your elements from top-navbar directly as children of OIC-container and delete the top-navbar container. Reset the z-index of OIC-containernav-container so it inherits the default z-index of 2 from OIC-container
Select your menu-button-wrapper and set it’s left-margin to 0
Delete your top-navbar-bg element
Move your cart-menu-wrapper outside your nav element so it is positioned in the body instead. Set its position to fixed-top-right and margins as so:
Set your nav’s BG color to white, 95 alpha
Set your OIC-container's BG Color to white, 95 alpha
Oh wow! Thank you so much for your efforts!!
So with this method I could actually keep the nav animation?
That’d be great!
I’ll certainly give that a shot – soon.
The shopping cart will not fall under the nav animation but your logo and the brand name should be unaffected. Please give it a try as it did work for me.
