Elements have duplicates of inherited styling causing margins, padding, etc to be duplicated or have incorrect positioning

Design help General
1

Hiya Webflow community,

I have an issue with the inherited styling on a few pages of my site –

If you navigate to the “Maintaining Carpeted Areas” page, go into the tablet breakpoint, select the “page headline” section, and then open the inheritance you’ll see that it’s inheriting styling from the original page headline section but it’s duplicating the margin-top attribute so that the section is being pushed down 160px instead of 80px. But if I change the margin-top to zero, then the desktop section is hidden under the nav.

Is there a way to reset this class so it’s not inheriting a double margin?

I’ve also run into a similar issue where the navigation, even though it is copy and pasted directly from the home page where it works perfectly, is changing positioning on other pages.

Here it is on the homepage:

image
image1138×216 43.5 KB

And here it is on a secondary page:

image
image1138×284 16.8 KB

Any help would be very much so appreciated!

Here is my site Read-Only: https://preview.webflow.com/preview/bayshorecarpetandupholsterycleaning?utm_medium=preview_link&utm_source=dashboard&utm_content=bayshorecarpetandupholsterycleaning&preview=819678fc4414a91279f40171a2029911&mode=preview

(how to share your site Read-Only link)

2

Quick tip! If you generate the sharing link inside of the designer (close to the publish button) while on the page you need help with, forum users will land directly on that page.

On the Homepage, your .b-header-2 element is position:fixed, so it doesn’t count in the flow of element, that’s why you have to add 80px top margin to .page-headline.

However, on the Tablet, the .b-header-2 element is position:static, meaning it counts in the flow of elements, so the next element with its 80px shift appears further away.

Everything is fine when I zero the top margin on Tablet, did you already fix it?

1 Like
3

Hey @vincent, thank so much for the speedy response and quick tip!

I totally forgot that I had duplicated this site from another project, and had added a second class onto two elements on the secondary pages:
image

Removing my not-fixed class makes everything work properly with the page headline section.
And exactly the same thing was mucking up the navigation - thanks for spotting this :slight_smile:

Removing the zero top margin on tablet worked for that one page, but it was messing up some of the other pages that had that same element/class combo - that might have been why it was seeming to work fine when you just zeroed the top margin in tablet for that one page. Now after removing the class everything is working!

1 Like