Home Forums Themes Support Claue Spacing between products on shop page

This topic contains 12 replies, has 2 voices, and was last updated by  Harry 3 weeks, 5 days ago.

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #33711

    My products are too far apart horizontally on shop pages.  How can i decrease this.?

    #33712

    this is only issue on mobile view by the way.

    #33719

    Hi,

    I see you added code

    @media only screen and (max-width: 768px) {	
    .product {
    	margin-top: 90px;
    }}

    Please find the code and reduce number

    Kind regards

    Harry
    Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    #33722

    code only works for the very top not space in between products horizontally.

    #33724

    If you want add space on vert top please change code to

    @media only screen and (max-width: 768px) {
    .products.jas-row  {
    	margin-top: 90px;
    }}

    Regards

    Harry
    Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    #33725

    not top. just the space in rows between all products Horizontally top to bottom

    #33726

    #33728

    Please remove the code you add

    .product {
    	margin-top: 90px;
    }

    Regards

    Harry
    Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    #33730

    this code just removes space only from very top of products.  i need it remove space from rows between products here:

    #33732

    Please remove code, it will apply for all, it now this affect to js so it add position to other product. Please remove, save and check again. Don’t use browser check

    Harry
    Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    #33733

    ok that worked thx!

    #33748

    So i put this code in css theme to cover mobile and desktop. Not working on either now.

     

    /* adjust space between product rows on mobile */
    @media only screen and (max-width: 768px) {
    .product {
    margin-top: 45px;
    }
    }

     

    and i tried this not working

    @media only screen and (max-width: 768px) {
    .products.jas-row {
    margin-top: 90px;
    }}

    /* adjust space between product rows on desk*/
    @media only screen and (min-width: 769px) {
    .product {
    margin-top: 40px;
    }
    }

    #33749

    Hi,

    The code

    @media only screen and (max-width: 768px) {
    .products.jas-row {
    margin-top: 90px;
    }}

    it work for first row of product on mobile.

    Kind regards

    Harry
    Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

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

You must be logged in to reply to this topic.