Hey, so I created a header component, for some reason the logo on the left scales different on different pages. The home page is the only page where it’s scaled correctly. I can’t seem to find the issue using the inspector and in design mode it looks fine, but once published the layout breaks. I already deleted the component from all pages and added them again, no luck.
We’d need your share link to know for sure but it sounds like you made a change to the “current” property. “Current” meaning the styles applied will only appear when viewing the page associated with the link. (In this case “madwomen” is linking to your homepage.)
When on your homepage, click on the “madwomen” link. Check to see if the style panel shows a green tag that states “current”. Reset any styles that are applied in this mode.
Then choose the non-current selector and make your changes there:
Alternatively, you can also make the changes on a different page, or you can temporarily unlink from the homepage, make your change and then relink it.
Sorry I messed up the read only link, I added it to the original post now.
I followed your advise and was able to fix it for the desktop version but the published version on mobile still shows the broken sizing on every page other than ‘home’. For the mobile version there is no other state than current to nothing to reset…
It looks like the smallest viewport has styling applied to the current selector. Once you reset these properties, you’ll want to reapply them to the non-current selector.
I find it easier to navigate to your About page and adjust the sizing from there, rather than adjusting it on the homepage.
I find it to be a little buggy when attempting to choose the non-current selector at the smaller viewport.
After you’ve reset the styles on the Current selector, you’ll notice the logo shrinks a lot. This is where I recommend going to a different page to make the change to enlarge the logo. Try navigating to your About page, change the viewport to the mobile width. Then make your modification to the logo there. This is one way to avoid seeing “current”
There are other hacky ways to avoid the Current mode. You can make a copy of link, remove the page link from it and then make the changes to that class (link-block2).
Or you can unlink it from the homepage, make the changes, then relink it.
Thanks you so much for your help. Is this a bug? It sounds like it. So I followed your steps (reset styles → go to about → change to mobile width → modification) and it still shows the wrong size an all pages except home
