Home Forums Themes Support Claue Spacing between products on shop page

Viewing 12 reply threads
  • 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 12 reply threads

You must be logged in to reply to this topic.