Elementor header is shifted to the right

Hi @dave,

Please leave the example URL to allow us to check it.

https://www.miniyut.org/%d7%aa%d7%a0%d7%99-%d7%9c%d7%90%d7%a6%d7%91%d7%a2%d7%95%d7%aa-%d7%9c%d7%9c%d7%9b%d7%aa-%d7%91%d7%9e%d7%a7%d7%95%d7%9e%d7%9a-%d7%a2%d7%9c-%d7%90%d7%95%d7%a0%d7%a0%d7%95%d7%aa-%d7%a0%d7%a9%d7%99%d7%aa/

Hi @elvina

Please look at the URL at the top of mybmessage. Please be advised that the issue occurs ONLY in mobile view (I haven't checked in Tablet via, Desktop view is OK).

I"ve reactivated wpDiscuz so you can see it. Please let me know if you need admin access.

Thanks

Dave

@dave, 

We've just checked your website on the mobile phone and don't find such an issue. See the screenshot below:

Please let us know the mobile device you faced with the issue.

@elvina

It was checked on two different Xiaomi phones and One Plus 6.

Following your latest reply I've checked again and it seems that the issue is Only when using Firefox (no problem with Chrome abd Edge).

Can you please check again using Firefox?

Thanks

@dave,

Please navigate to Dashboard > Comments >Settings > Styling admin page, put the following CSS code in the "Custom CSS Code" textarea and check again:

section.has_ae_slider {
   width: 100% !important;
}

Please note mobile browsers have a hard cache, you'll not be able to see the change immediately so please try on incognito mode.

@elvina

Thank you very much for being so responsive.

The CSS code solve the issue with the header being shifted. Unfortunately it created another issue (once again, it's only I Firefox). It starched the header as you can see in the attached photo (the right side of the logo on the right of the header is cut and the header is taller). Any idea how to fix that?

Thanks

Dave

I missed the other photo that shows that the header under the advised CSS code extend to the right (and somewhat to the bottom)

@dave,

For further support please deactivate the wpDiscuz plugin and let us know.

I deactivated the plugin.

When the plugin is inactive everything is OK (even with Firefox).

If you need admin rights to further investigating the matter, please provide an email and I'll send you the required information.

Thank you in advance for all the support

Dave

@dave,

Please reactivate the wpDiscuz plugin and let us know. We'll check it one more time.

@elvina

I reactivated the plugin

@dave,

Please try to following CSS code and check again:

html, body {
overflow: -moz-scrollbars-none;
}

More info here: https://www.w3schools.com/howto/howto_css_hide_scrollbars.asp

This also can be helpful for you: https://stackoverflow.com/questions/16261870/hide-scrollbars-for-responsive-design-view-in-firefox-without-affecting-mobile-i?rq=1

@elvina

Hi,

I've placed the new code under the Styling section of wpDiscuz plugin, along with the previous CSS code that you sent. Unfortunately, the issue remains as it was after I entered the first CSS code. If I should have placed the new code in another location, please advise where.

I've looked at the links that you provided and understand that you believe that it's a scrollbar issue?

Pleas let me know if you think that there is any piece of advice that you can give me. In any case, I want to thank you for all the effort you put in trying to help me solve the issue.

Dave

Hi @dave,

Please keep all codes provided by Elvina and add the code below as well. 

section.has_ae_slider {
   width: 100% !important;
}

I've looked at the links that you provided and understand that you believe that it's a scrollbar issue?

Yes, indeed we think the issue is related to the scroll bar. However The code above should solve the issue. 

Please don't forget to check on incognito mode.

@astghik

Hi Astghik

Attached please find a screenshot of the CSS code that I have under Styling. I received two pieces of code and they are both included.

The issue persist but ONLY when comments are entered via Desktop. When I entered comments via Mobile phone the header was OK.

Attached please find a screenshot of the page when I experience the issue - header is starched to the right (and somewhat to the bottom) which creates wide margins on the right side of the page.

Did the further information provided (issue occurs only when comments are entered via Desktop) helps in any way? 

Thank you for all the support so far. 

Dave

@dave, 

We've checked many times. As you can see in the recorded video below there is no such an issue.

https://www.screencast.com/t/rHFbaOKvhg

@elvina

Hi,

I don't know on which device the video that you sent was recorded on. Unfortunately, the issue does exist, at least on the three mobile phones that I tested (Xiaomi Pocophone F1, Xiaomi Mi A1 and One Plus 6).

The attached video was recorded on Xiaomi Pocophone - as you can clearly see, the header extends to the right and there is a margin on the right hand side all the way down.

I truly appreciate all the support provided and your efforts to help me resolve the issue. I understand that at this point there is nothing further that can be done.

All the best

Dave

ok @dave,

Please send the admin login details to info[at]gvectors.com email address. We'll try to find some solution for you. 

@astghik

Please let me know when you no longer need the admin rights that I gave you, so I could delete that user. Thanks