Notifications
Clear all

[Solved] problems in the mobile version of the site (layout)

17 Posts
2 Users
1 Likes
2,280 Views
Posts: 24
Topic starter
(@artyr)
Eminent Member
Joined: 2 months ago
16 Replies
Chris
Posts: 2778
Admin
(@chris)
Support Team
Joined: 2 years ago

We don't face UI/UX issue on that post in the mobile version, what's your Mobil screen resolution?

15 Replies
(@artyr)
Joined: 2 months ago

Eminent Member
Posts: 24

@chris It turned out that the problem is not on your side, but apparently on mine.
Please tell me how to fix this problem

Page

Horizontal scrolling appeared in the mobile version. And I can't find the cause of this problem.

Chris
Admin
(@chris)
Joined: 2 years ago

Support Team
Posts: 2778

@artyr,

Insert below CSS Code in Custom CSS Code Field from Dashboard > wpForo > Settings > Colors & Styles Tab:

@media screen and (max-width: 460px) {
    #wpforo #wpforo-wrap {
        width: 98%;
        margin: 0px auto;
    }
}
(@artyr)
Joined: 2 months ago

Eminent Member
Posts: 24

@chris Didn't help, need another code 😥

Chris
Admin
(@chris)
Joined: 2 years ago

Support Team
Posts: 2778

@artyr,

what is the screen resolution of your phone(the width), the code works for screens with 460px and more.

(@artyr)
Joined: 2 months ago

Eminent Member
Posts: 24

@chris I have an iphone 11

Your code worked, but it doesn't fit me. Since I don't want to indent the entire site in the mobile version

Chris
Admin
(@chris)
Joined: 2 years ago

Support Team
Posts: 2778

@artyr,

Try this:

@media screen and (max-width: 460px) {
    #wpforo #wpforo-wrap {
        width: 100%;
        margin: 0px auto;
    }
}
(@artyr)
Joined: 2 months ago

Eminent Member
Posts: 24

@chris This code does not solve the problem

Please try to solve this problem 😥

Chris
Admin
(@chris)
Joined: 2 years ago

Support Team
Posts: 2778

@artyr,

The reason of the problem is your theme "couponis", no matter what CSS I write, it changes everything back by default, try changing t another theme which would not make such changes.

I can recommend: Shuttle iBussines, Astra, Twenty Twelve

(@artyr)
Joined: 2 months ago

Eminent Member
Posts: 24

@chris And what kind of CSS code breaks the design?

Chris
Admin
(@chris)
Joined: 2 years ago

Support Team
Posts: 2778

@artyr,

I guess It's not only CSS, as I tried to fix the issue with another CSS which could overwrite the problematic one.

(@artyr)
Joined: 2 months ago

Eminent Member
Posts: 24

@chris I like my theme, I tried the themes you suggested - I don't like them
I will look for ways to fix this problem with my Theme

But if you find the reason and tell me how to solve it - I will be very grateful!

Chris
Admin
(@chris)
Joined: 2 years ago

Support Team
Posts: 2778

@artyr,

I'm sorry, but I couldn't find other solution to fix that issue.

(@artyr)
Joined: 2 months ago

Eminent Member
Posts: 24

@chris Chris I found the problem. More specifically, two problems
This is a wpForo template issue

the screenshot shows two places due to which horizontal indentation appears on mobile devices

Breaks Vetka from user Егорка
https://forum.avitoman.ru/postid/50/

Chris
Admin
(@chris)
Joined: 2 years ago

Support Team
Posts: 2778

@artyr,

Try here and you will see that, the pointer is not the problem maker.

(@artyr)
Joined: 2 months ago

Eminent Member
Posts: 24

@chris Yes indeed. There are no problems with your template.
As a result, I found the problem and corrected the styles on my side.
Thanks for the help!
I'm closing the thread!