Margin-top not applied until scroll on Firefox

Support
#1

Hi,
On my site https://trulycreativedesign.com/ I am adding a margin-top:-100px to a custom id: slider-top to my top HOME-SLIDER-SECTION. This works great on chrome when I load the page but I am getting an issue with firefox. The -100px isn’t applied on firefox until I scroll down the page a little.

Do you know why the -100px would not load on page load on firefox?

Thanks
Chris

#2

Hello Chris,

Thanks for writing in!

Upon checking the website it seems that you are using X Theme version 6.4.6. Please update X Theme to latest version which as of today is 6.5.5 to avoid any compatibility related issues.

You can take a look at following resources to update X Theme.

https://theme.co/changelog/

Thanks.

#3

Hi,
Ok I updated my theme and I am still getting the issue with margin-top in firefox.

#4

Hi @Chgrim,

Please replace your code with the following one:

#slider-top {
	top: -100px;
	position: relative;
}

Don’t forget to clear all caches including your browser’s cache after adding the code. Let us know how this goes!

#5

Hi Nabeel,

I added the relative positioning and it’s still not working with firefox.

Thanks so much
Chris

#6

Hey Chris,

I checked your site and I see you’re still using an old code with margin-top:

#slider-top {
    margin-top: -100px;
    position: relative;
}

Please replace it with the code provided above:

#slider-top {
	top: -100px;
	position: relative;
}

So margin-top: -100px; will be replaced with the top: -100px;

Let us know how this goes!

#7

That did the trick! Thanks so much!

#8

You’re welcome.

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.