Your account expired support, please renew to get your support.

Home Forums Themes Support Pangja Website page display narrow on mobile

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #5445
    Alexsandros
    Support Expired

    Hello,
    My whole website is quite narrow on mobile and doesn’t look very responsive.
    Is there a way to arrange that ?
    Or do I need to customize every single page of the website one by one ?
    Regards

    • This topic was modified 1 year, 5 months ago by Alexsandros.
    Attachments:
    You must be logged in to view attached files.
    #5449
    Alexsandros
    Support Expired

    Also, How can I enlarge the pages on mobile ?
    I mean the width, as it looks narrow now.
    Please see attached screenshot “capture 2” on previous post.

    • This reply was modified 1 year, 5 months ago by Alexsandros.
    #5464

    Hi,
    1. We checked our demo and it’s working fine:
    https://prnt.sc/rwgosb
    So if you customized something and it break this. Please return to original.
    If you added CSS in somewhere and on mobile you need remove it you can use this code:

    @media screen and (max-width: 767px) {
    .some-class {
    // Your CSS code
    }
    }

    You can see reference here: https://www.w3schools.com/css/css3_mediaqueries_ex.asp
    2. We checked and see table also responsive: https://prnt.sc/rwgql8. We don’t know how you create table but here is example:
    https://www.w3schools.com/bootstrap/bootstrap_ref_css_tables.asp

    ****
    Regards,
    HaruTheme

    #5473
    Alexsandros
    Support Expired

    Thanks so much !
    Yes indeed, I’ve checked all my CSS and forgot to add @media for mobile pages

    So I added the code and it sorted out :
    @media screen (max-width: 767px)
    {
    .haru-page {
    margin: 0 50px;
    }
    }

    Maybe I should add this code only on the specific page where I want the margin ?
    What do you think ?

    Regards

    #5474

    Hi,
    If you use it for special page you can add extra class for page in Page Options like this:
    https://prnt.sc/ry4r6k
    Then you can CSS for only this page.
    Hope this help!

    *****
    Regards,
    HaruTheme

    #5477
    Alexsandros
    Support Expired

    Hi,
    I’ve double checked my page and now it doesn’t work.
    I thought the code worked but apparently not.
    Am I mistaken somewhere ?
    I’ve tried both @media screen and (max-width: 767px) and @media screen (max-width: 767px)
    (without the “and”
    Please see attached screenshots.
    Regards,

    • This reply was modified 1 year, 5 months ago by Alexsandros.
    Attachments:
    You must be logged in to view attached files.
    #5481
    Alexsandros
    Support Expired

    Never mind.
    The code was min-width and not max-width.

    #5482
    Alexsandros
    Support Expired

    BTW, if I add the extra class code in the page, it makes the margin to the entire page. Which I don’t want.
    Do you know another way ?

    Attachments:
    You must be logged in to view attached files.
    #5487

    It will depend on your page you want it.
    Example in Shop page the element is:
    .haru-archive-product
    https://prnt.sc/rz4ytq
    Hope this help!

    ****
    Regards,
    HaruTheme

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.