Wordpress site homepage splits vertically in Firefox only.
I am a graphic designer (not much of a coder) and am responsible for updating a wordpress based site:http://www.autismfamiliesct.org/. I think the slider is the reason the top of the page has a space separating it from the bottom half of the page. This is only happening in Firefox. I tested the page on my work computer as well and got the same result so I know it has nothing to do with cookies or cache.
All Replies (2)
Try fixing these errors : HTML https://validator.w3.org/nu/?doc=http%3A%2F%2Fwww.autismfamiliesct.org%2F
Please let us know if this solved your issue or if need further assistance.
It seemed fine until the slideshow viewer loaded...
This is odd. It's on line 903 of http://www.autismfamiliesct.org/wp-content/themes/connecticut/style.css?ver=4.6.9
@-moz-document url-prefix() {
.homeContainer {margin-top: 95px !important;}
}
That's probably not helping.
But the main issue is that div.sliderContainer is positioned about 45 pixels higher in Chrome than it is in Firefox. In both browsers, they have
margin-top: -84px
but as shown in the attached screenshots, there is about a 45 pixel difference in where the elements end up, and that causes a gap in Firefox, since the site was designed/tested in Chrome. If I turn off the negative margin in both browsers, the difference in position remains. But I can't spot the reason for it.
