Hero image issues on certain browsers

Hi guys,

i’m experiencing a very weird issue and i was wondering if you could tell me why is it happening so i can fix it.

Everything is perfect if i access my dev site on chrome (it looks like this: http://prntscr.com/h4fxqq ).
however, if access from explorer i see this: http://prntscr.com/h4fzwq . in explorer i also have issues with the footer: http://prntscr.com/h4g08h (it should look like this: http://prntscr.com/h4g0h3 )
same thing happens if i access from firefox: http://prntscr.com/h4fy9b

it seems the hero page is not really going full page, which is weird because the height is set to 100vh and before that it was set to auto. on explorer it seems to be showing the mobile version of the site (or at least the mobile css configuration of some of the elements!)

hope you can help me find the culprit of the entire issue!

Hi,

Upon checking, I can see it’s still set to auto.

Try to set your bar height again to 100vh

Thanks

man, this is so weird, i’m starting to think that i either have a multiple personality disorder or there are a few bugs hidden in my site because i changed it like 4 times (because 100vh wasn’t working) and i never set it to auto (that was the initial setting) and now i see it set to auto again!.

it has happened to me already on the color and font template and on different footers as well! i change or add new stuff, save and then it seems like it goes back to a previous version of the template or footer/header.

right now the issue with the height is fixed but i still see the mobile layout in explorer. it should look like this: http://prntscr.com/h5750z

instead it looks like this: http://prntscr.com/h5767d

Hi there,

First of all, thank you for the report regarding the resetting problems. I remember we had few glitches regarding this which should be fixed already. Would you please kindly update the theme to version 1.2.4?

Regarding the problem you are experiencing I suggest that you take another route. Try to use the max-width option of the container to force it to stay for example half the width:

Then, force the content inside the container to go to the right/left as you want. As you may already know we only support Internet Explorer 11. That version has few bugs regarding the flex properties and most of the time it is because of the values are given without unit, such as auto. For the complete list of the problems and the workarounds please kindly check this article:

Thank you.

hey guys, would you mind checking my site right now? i don’t know if it was an update or something but the entire layout is totally out of place. it should look like this: https://prnt.sc/h4fxqq

instead it looks like this, now: http://prntscr.com/h7a4cd, it even overflows and i have no clue what is causing it.

i haven’t touched that particular header (hero header) in a while because it was almost finished (the only problem with it was the issue on explorer), i have been writing JS code but not for this header so it shouldn’t affect it.

i just updated the theme to the last version and made sure i’m using the right child theme so that’s not an issue either.

Hi there,

Weird, why it says the update is available but it’s already updated, perhaps your dev sites has an internal cache? Plus, it doesn’t look like your two screenshots on my end. It’s purely texting with no styling in my display. There is no broken, those texts don’t really have styling when I checked them in the editor. Perhaps you have a working copy of this that may help us comparing how it was made?

Thanks!

i updated to pro 1.2.6 and the problem instantly disappeared! damn bugs, hehe.

Thanks for letting us know!

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