Kristoff Posted August 23, 2013 Share Posted August 23, 2013 Hi guys... I'm working on a custom template, but can't find anywhere to edit the products per row?! At the moment it is making every 4th product in the row "product.last" and taking off the margin. Anyone know where I can change this to 5 per row? Am I missing something in the settings?! Cheers Quote Link to comment Share on other sites More sharing options...
Kristoff Posted August 23, 2013 Author Share Posted August 23, 2013 By the way, have tried changing the value in classProducts.js and classSubCat.js but hasn't worked. Quote Link to comment Share on other sites More sharing options...
bsmither Posted August 23, 2013 Share Posted August 23, 2013 "can't find anywhere to edit the products per row" In what area of the store? I assume Latest Products area of the Homepage. And for a custom template, it may be beneficial to see it in action. Anyway, look in the CSS files for the pseudo-class :last. (I haven't looked for it myself.) Quote Link to comment Share on other sites More sharing options...
Kristoff Posted August 23, 2013 Author Share Posted August 23, 2013 "can't find anywhere to edit the products per row" In what area of the store? I assume Latest Products area of the Homepage. And for a custom template, it may be beneficial to see it in action. Anyway, look in the CSS files for the pseudo-class :last. (I haven't looked for it myself.) In the category, as the title of the post suggests It's not the style of :last that is the issue, it's that I need 5 on a row, which i've got, but at the moment it's calling :last after the 4th one. Take a look: http://applecoredownloads.com/store1/ The homepage and categories are doing the same. Quote Link to comment Share on other sites More sharing options...
bsmither Posted August 23, 2013 Share Posted August 23, 2013 Looks like the skin is fixed-width, so there is no worries about there being less or more than five to fit on a line. In your common.css file, line 1037, you can:* remove the entire CSS rule, or* comment out the margin-right property, or* #productContainer .products:nth-child(4n) change (4n) to (5n) Browser Compatibility:nth-child is one of those rather unfortunate CSS attributes that is caught between nearly full cross-browser compatibility, except for completely zero support in IE, even IE 8. Quote Link to comment Share on other sites More sharing options...
Kristoff Posted August 23, 2013 Author Share Posted August 23, 2013 Perfect thanks. Changed the javascript, changed the CSS and it worked. Didn't realise there was related CSS! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.