Scroll anchor affecting content beneath it

Bump

Hi there,

Your site is under coming soon. Any chance you can unlock it so we can see the issue?

Hi Leo,

My apologies, I have now removed the coming soon page.

Just to reiterate, the masonry grid seems to switch to one column once I have added the HTML in my OP to the page header element.

Any ideas guys?

Hi there,

The coming soon page still seems to be up. Can you check?

Are you adding it as a "Header Element"?

It can take up to 24 hours for us to reply to a topic (especially on a Sunday), although it's usually much quicker than that. Feel free to bump a topic if it takes longer than that :)

Ah sorry, my bad!

I'm adding the scroll button at the bottom of my existing page header element. I'll re-up the proper link tomorrow once the site goes live.

Thanks!

One thing I noticed about your code above is that it's missing a closing </a> tag.

Try this:

<a class="smooth-scroll" href="#latest-interview"><img src="image URL"/></a>

The extra </a> solved it. Thanks Tom.

Anyone know how I can get it to be in the same place on numerous devices?

I used something like

.page-hero .inside-page-hero a {
top: 48vh !important;
position: relative;
}

And it's still not positioning correctly on all devices. Any ideas? The site is now open and you're looking for a white arrow!

Give this a shot:

.page-hero {
    position: relative;
}

.page-hero a.smooth-scroll {
    position: absolute;
    bottom: 30px;
    top: unset !important;
}