Theme great on chrome but appears bad on firefox and edge

  • Resolved jasosli77

    (@jasosli77)


    7 years, 7 months ago

    I use optimizer for both my sites (artisantree.org and epicjason.com). They front page on both these sites look great on chrome but they look bad on firefox and edge. On fire fox and edge, the images and text I have on the slider are jammed up beyond the menu bar. What can I do to fix this?

Viewing 6 replies - 1 through 6 (of 6 total)
  • CrouchingBruin

    (@crouchingbruin)

    7 years, 7 months ago

    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.

    Thread Starter jasosli77

    (@jasosli77)

    7 years, 7 months ago

    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 7 years, 7 months ago by jasosli77.
    CrouchingBruin

    (@crouchingbruin)

    7 years, 7 months ago

    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.

    Thread Starter jasosli77

    (@jasosli77)

    7 years, 7 months ago

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

    CrouchingBruin

    (@crouchingbruin)

    7 years, 7 months ago

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

    
.home .stat_content_inner {
   bottom: 0;
}
    Thread Starter jasosli77

    (@jasosli77)

    7 years, 7 months ago

    Thanks CrouchingBruin! That solved my problem!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Theme great on chrome but appears bad on firefox and edge’ is closed to new replies.