reverse the order on mobile

Home Forums All Other Themes reverse the order on mobile

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #213320
    Andrea AlbertinAndrea Albertin
    Participant
    • Topics: 4
    • Replies: 19
    • Total: 23
    Member since: February 8, 2024

    Hi,
    I’m working with the gbhotel template.
    I need the columns in the “Our Services” section on the home page to reverse the order on a smartphone, so that you see the text first and then the tiles with the icons.

    Thank you

    #213325
    Sonnal S SinhaSonnal S Sinha
    Moderator
    • Topics: 0
    • Replies: 30618
    • Total: 30618
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    @media screen and (max-width:479px) {
    .skt-blocks-ifb-title-wrap {
        top: -80px;
        position: relative;
    }
    .skt-blocks-ifb-image-icon-content.skt-blocks-ifb-imgicon-wrap {
        bottom: -40px;
        position: relative;
    }
    }

    Regards,
    Dave

    #213346
    Andrea AlbertinAndrea Albertin
    Participant
    • Topics: 4
    • Replies: 19
    • Total: 23
    Member since: February 8, 2024

    Hi,
    I tried it, but it doesn’t work.

    This is my test page: https://demositeweb.free.nf/about/

    Refer to sections that have columns showing images on the left and text on the right on the desktop, such as “Title 1” and “Title 3.”

    Now, when I open the page from mobile, the images appear first and then the text.
    I want to get the opposite, first the text and then the images, like the section with “Title 2”

    On html I used this class:
    @media (max-width: 767px) {
    .row-reverse-sort-sm {
    display: flex;
    flex-direction: column-reverse;
    }
    }

    Thanks again

    #213406
    Sonnal S SinhaSonnal S Sinha
    Moderator
    • Topics: 0
    • Replies: 30618
    • Total: 30618
    Member since: August 16, 2013

    Hi,

    Kindly send us your URL of the site and WordPress admin details (Username & Password) via email:[email protected] Please mention this forum URL while replying so that we understand what needs to be done.

    We’ll check and revert back to you.

    Regards,
    Dave

    #213419
    Andrea AlbertinAndrea Albertin
    Participant
    • Topics: 4
    • Replies: 19
    • Total: 23
    Member since: February 8, 2024

    Hi,
    I sent the email.
    Regards

    #213423
    Sonnal S SinhaSonnal S Sinha
    Moderator
    • Topics: 0
    • Replies: 30618
    • Total: 30618
    Member since: August 16, 2013

    Hi,

    Given login details isn’t working. We are getting this message.

    https://nimb.ws/hdxCW6

    Regards,
    Dave

    #213424
    Andrea AlbertinAndrea Albertin
    Participant
    • Topics: 4
    • Replies: 19
    • Total: 23
    Member since: February 8, 2024

    Hi,
    now it seems ok.

    Try it please.

    #213431
    Sonnal S SinhaSonnal S Sinha
    Moderator
    • Topics: 0
    • Replies: 30618
    • Total: 30618
    Member since: August 16, 2013

    Hi,

    Issue have been resolved on mobile screen. kindly check and confirm.

    https://demositeweb.free.nf/about/

    Regards,
    Dave

    #213603
    Andrea AlbertinAndrea Albertin
    Participant
    • Topics: 4
    • Replies: 19
    • Total: 23
    Member since: February 8, 2024

    Hi Dave,
    I saw the modification and it works. Thank you!

    I made a small change to the class. By doing so, I just need to add the “gb-column-reverse” class in the ADDITIONAL CSS CLASS(ES) of the section where the columns must be reversed on mobile:

    @media screen and (max-width:767px) {
    .gb-column-reverse .responsive-columns-inner-wrap.responsive-columns-columns-2 {
    display: flex;
    flex-direction: column-reverse;
    }
    }

    Do you have any objections or is my modification correct?

    Thanks again for the support

    #213725
    Sonnal S SinhaSonnal S Sinha
    Moderator
    • Topics: 0
    • Replies: 30618
    • Total: 30618
    Member since: August 16, 2013

    Hi,

    Yes, your modification is correct👍

    Regards,
    Dave

    #213772
    Andrea AlbertinAndrea Albertin
    Participant
    • Topics: 4
    • Replies: 19
    • Total: 23
    Member since: February 8, 2024

    Fine.

    Thanks,
    Regards

    #213776
    Sonnal S SinhaSonnal S Sinha
    Moderator
    • Topics: 0
    • Replies: 30618
    • Total: 30618
    Member since: August 16, 2013

    Hi,

    If you found our service good kindly review us here: https://www.trustpilot.com/review/sktthemes.org

    Regards,
    Dave

Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.