Theme great on chrome but appears bad on firefox and edge

Are your browser windows the same size when you look at the sites? Both sites look the same to me on both Chrome and Firefox when the browser windows are the same width.

Yes, the windows are the same size, full screen on a laptop. I’ve tested this on different computers (all full screen).
When you looked at it, did the images look too high? On epicjason.com, there’s an image that says: Join the Epic “At last a great fantasy novel” and it has a picture of my book’s cover. On Edge and Firefox, that image goes beyond the top of the screen and is cut off. Do you see that too?

• This reply was modified 8 years, 2 months ago by jasosli77.

On both Chrome and Firefox, the header image appears to be cut off, i.e., shifted up.

This is what it looks like under Firefox.

This is how it looks under Chrome.

The culprit appears to be this CSS rule:

.stat_content_inner{bottom:33%; color:#ffffff;}

Having the bottom set to 33% is shifting the entire content up. If you need to move it up on mobile devices, best to put it inside a media query.

Thank you so much for finding the problem. How would you suggest I fix it? (I know some but not much of css)

Go to Appearance → Customize → Miscellaneous → Custom Code and copy & paste this rule in the Custom CSS field:

.home .stat_content_inner {
   bottom: 0;
}

Thanks CrouchingBruin! That solved my problem!