Home Forums WoodMart support forum align the image to the center on mobile

align the image to the center on mobile

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #605247

    meiotrevo.pt
    Participant

    I’m sorry to bother you again with this subject, but is it possible to align the image to the center on mobile?

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

    Hello,

    Sorry to hear about the inconvenience. Kindly, please share your Site WP-ADMIN Login details in the Private Content field so that we can check this concern on your Site and help you out accordingly. Also share the page url where the image is situated.

    Best Regards

    #605531

    meiotrevo.pt
    Participant

    I will leave the logins private

    #605716

    Hello,

    To align the image to the center on mobile, you can create a separate row specifically for mobile with a different background image. Here’s how to do it.

    Create two rows—one for desktop and one for mobile. you need to assign a class and hide it with the custom CSS. This will allow you to have a centered background image on mobile while keeping the layout intact for desktop.

    Best Regards

    #605734

    meiotrevo.pt
    Participant

    Can you help me with this custom css?
    I’m not a programmer and I really don’t know how to do it.

    #605815

    Hello,

    Add the classes desktop-row and mobile-row to your rows, and this CSS will hide the desktop row on mobile and show the mobile row.
    Please try adding the following Custom CSS in the desktop Custom CSS area under Theme Settings >> Custom CSS.

    /* Hide on desktop */
    .mobile-row {
        display: none;
    }

    Add the below Custom CSS code to Theme Settings > Custom CSS > Custom CSS for Mobile section:

        /* Show on mobile */
        .desktop-row {
            display: none;
        }

    Best Regards

    #605844

    meiotrevo.pt
    Participant

    I did the test and it really works for line, but it seems that it doesn’t work for section. is it normal?

    #605950

    Hello,

    Could you please share some screenshots which issue you have faced? so I can better understand your issue? This will help me guide you more effectively.

    Best Regards

    #606014

    meiotrevo.pt
    Participant

    Of course!

    So what I did was duplicate the section that I want to work on on mobile, which is the home banner.

    The first section will be visible on the desktop. I used the desktop-row code as shown in the screenshot.

    The second section will be visible on mobile usei a cor preta de fundo para ser fácil de distinguir. I used the mobile-row code as shown in the screenshot.

    But as you can see in the other screenshots, both sections are visible, on both screens.

    Attachments:
    You must be logged in to view attached files.
Viewing 9 posts - 1 through 9 (of 9 total)