Elements and text extend beyond the boundaries of the mobile device screen

I’m experiencing the same with ColorMag.

Hi @test033 @kencraftmdm,

Thanks for reaching us,

We are aware of the issue related to the Betterdocs plugin where the content and elements are going out of alignment on mobile devices. The issue has been assigned to the developer. Once it is fixed, we will be releasing the fix with update after which the issue will be fixed on your end.

Let me know if you have any confusion or issues and I will get back to you.

Regards

We’re having this issue with the ColorMag theme, not the BetterDocs plugin.

Hi @kencraftmdm,

The issue is with the ColorMag theme on which our team is working on. Once the issue is fixed we will release an update with the fix after that you can update the ColorMag theme which will fix the issue on your end.

Let me know if you still have any queries or confusion and I will get back to you.

Regards

Hello, Barsha Paudel.

I wanted to clarify that the solution provided by BetterDocs plugin support https://www.ads-software.com/support/topic/betterdocs-content-and-elements-extend-beyond-the-screen-on-your-mobile-device/#post-16865332, partially solves the problem on their part. However, when using their provided code, there are problems with photos in articles and blog categories. I understand there is a problem on your side of the ColorMag theme as well, as mentioned by BetterDocs support and you in a previous post: https://www.ads-software.com/support/topic/elements-and-text-extend-beyond-the-boundaries-of-the-mobile-device-screen/#post-16855454.

At the moment, I’m not using the code provided by BetterDocs support.

* ,
*:before,
*:after {
   -webkit-box-sizing: border-box!important;
   box-sizing: border-box!important;
   max-width: 100vw!important;
}

#aswift_2_host {
   max-width: 100vw!important;
}

#betterdocs-single-main{
box-sizing: border-box !important;
  max-width: 100vw !important;
  width:100% !important;
}

@media only screen and (max-width: 850px) {
   .adsbygoogle > div {
      width: 100%!important;
   }
}

As it in my understanding, conflicts with the theme. Is there anything I need to do to help you, or are you on your side, can you reproduce it all?

I am writing this message so that you have more information to solve the problem. Thank you in advance.

Hi @test033,

Thank you for the suggestion,

Currently our team is working on the fix regarding the conflict with the Betterdocs plugin. Hopefully with the new version of the theme released, the issue will be fixed on your end too.

Let me know of any other issues or confusion and I will get back to you.

Regards

Unfortunately, there was no solution to the problem in my case with the conflict between the ColorMag theme and the BetterDocs plugin.

Several updates to ColorMag did not solve the problem. The solution provided by the BetterDocs developers was not a complete solution.

Therefore, I made a decision and switched to another Knowledge Base for Documentation, FAQs with AI Assistance plugin, where there is no conflict between the Knowledge Base plugin and the ColorMag theme.

On this basis, although the topic is not solved with the conflict between the BetterDocs plugin and the ColorMag theme, I consider it necessary to close it, as it is no longer relevant in my case.

Thank you for your attention and attempts to solve the problem.

• This reply was modified 1 year, 3 months ago by test033.

Hi @test033,

Thanks for the update. Let me know of any other confusion or issues, and I will get back to you.

Regards