Mobile site category/product images issue

Home Forums All Other Themes Mobile site category/product images issue

This topic contains 5 replies, has 2 voices, and was last updated by  Forum Moderator 2 years, 4 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #28205

    Sergey Pavlov
    Member
    • Topics: 6
    • Replies: 7
    • Total: 13
    Member since: June 16, 2015

    Hello. I have Gravida theme with Woo Commerce plugin. I think there is a conflict of plugin and the theme on mobile version. Category, or other pages with two colomns of images are looks broken. For ex. 6 images on mobile version will not stay in two colomns and three rows. There is a blank spaces in the right colomn and you can’t click on image as several images of products got the same URL in mobile version.

    Looks like CSS conflict is there.

    #28319

    Forum Moderator
    Member
    • Topics: 0
    • Replies: 17394
    • Total: 17394
    Member since: August 16, 2013

    Hi Sergey,

    Kindly show us your website URL.

    Regards,
    Dave

    #28371

    Sergey Pavlov
    Member
    • Topics: 6
    • Replies: 7
    • Total: 13
    Member since: June 16, 2015

    Hello Shri,

    Here is the link: http://www.paragoninteriors.ca/product/duke-pool-table/

    Please check it in the mobile view. In the desktop version products pictures looks fine. Only the problem when you have two columns of pictures on small screen. For ex. http://www.paragoninteriors.ca/furniture/billiard-tables/paragon-pool-tables/

    You can check any page with several pictures of products. They all have a
    white space in the right column. You can’t click on some pictures on the
    left as they all covered URL from the lowest image.

    Thank you

    Sergey

    #28428

    Forum Moderator
    Member
    • Topics: 0
    • Replies: 17394
    • Total: 17394
    Member since: August 16, 2013

    Hi Sergey,

    Kindly go to Appereance>>Customize>>Custom CSS Box

    Add this code:

    @media screen and (max-width:767px) {
    .products .last { float:left !important;}
    }

    Regards,
    Dave

    #28554

    Sergey Pavlov
    Member
    • Topics: 6
    • Replies: 7
    • Total: 13
    Member since: June 16, 2015

    Hi Dave,
    I did what you suggested. It works fine now! The mobile version looks right, no white spaces and images in two columns now.

    Thank you for such good help.
    Sergey

    #28611

    Forum Moderator
    Member
    • Topics: 0
    • Replies: 17394
    • Total: 17394
    Member since: August 16, 2013

    Okay great.

    Regards,
    Dave

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

You must be logged in to reply to this topic.