Streaming live at 10am (PST)

Elements in Symbol changing when symbol added to other pages

#1

Hi everyone,

I’ve seen a couple threads similar to this, but have not yet found anything that helps my situation.

I created a custom fixed navbar for my Tablet and Mobile breakpoints, which I then made into a symbol. It works pretty much as expected on my Home page, however as soon as I try and paste it to any of my other pages, the elements inside go crazy. Assistance ASAP would be greatly appreciated!

Caleb K.


Here is my site Read-Only: https://preview.webflow.com/preview/somerset-view?utm_source=somerset-view&preview=5cafe1c753081578f364b625acdc264b
(how to share your site Read-Only link)

#2

Do you mind making a screencast of what’s going wrong? As far as I can see your menu is quite empty and you’re using a lot of conditional visibility on elements, their parents and siblings. (you shuld remove them all and use Display:none instead).

I tried adding the symbol to other pages and it works well. But there’s not much inside of the symbol.

#3

Hi @vincent, I’ve gone and changed everything to the best of my knowledge and removed all instances of conditional visibility. I still find that when I try and add the Mobile Fixed Navbar symbol (in the Tablet breakpoint) to any page other than Home, the logo is huge and overflows outside of the navbar. There should only be a short logo on the left side, with the 3-bar nav menu on the opposite side.

Let me know if there’s anything else that seems to be complicating matters… I’m quite a newbie and I know I’m going to be absolutely horrified when I look back at this site build a year or two down the line lol.

#4

You have styled your brand element (logo and parent elements) on your Homepage.

And the brand element is actually a link, and this link is pointing to the homepage.

So when you’re o the homepage with this link selected, you can see that it doesn’t have just the normal class, but a green combo class called CURRENT.

That’s because you’re on the CURRENT target for the link.

So you have styled the logo for its CURRENT state, not the normal state that will show up on any other page.

So you can select it on home, remove any styling thatis showing up in blue, then go to another page and style it again from there. Now it will be the same on every page.

#5

You are incredible, thank you. I would have probably never figured that out.

Many thanks! Case closed.

Caleb K.