WordPress.org

Forums

WooCommerce - excelling eCommerce
Catalog only shows 1 column (3 posts)

  1. keeleon
    Member
    Posted 1 year ago #

    I think I've got most of the bugs worked out of my site, and now I'm trying to make it a little prettier, which means learning more about CSS

    Looking at my site: http://www.thebrasswardrobe.com/product-category/clothing/ I have my catalog items only showing in a single line. I believe this is due to each item's width is taking up more than half of the allocated space in that area. However, I am unable to find where to make this change. Using Firebug I found that the content area for a single item:

    <li class="post-571 product type-product status-publish hentry instock" style="
        width: 200px;
    ">
    
    	<a href="http://www.thebrasswardrobe.com/product/brushed-twill-bib-shirt/">
    
    		<img width="150" height="150" src="http://www.thebrasswardrobe.com/wp-content/uploads/2013/06/538720-BRN-preview-150x150.jpg" class="attachment-shop_catalog wp-post-image" alt="538720-BRN-preview">
    		<h3>BRUSHED TWILL BIB SHIRT – BROWN</h3>
    
    	<span class="price"><span class="amount">$55</span></span>
    
    	</a>
    
    						<div class="gridlist-buttonwrap">
    
    	<a href="http://www.thebrasswardrobe.com/product/brushed-twill-bib-shirt/" rel="nofollow" data-product_id="571" data-product_sku="538720-BRN" class=" button product_type_variable">Select options</a>
    					</div>
    									<hr>
    
    </li>

    is taking up 490px x 259px. Where would I make a change to adjust that? Doing a temp change in firefox to like 200px x 250px looks like it would allow for almost 3 columns. But I can't find where in my theme or woocommerce CSS I would make this change.

    http://wordpress.org/plugins/woocommerce/

  2. varktech.com
    Member
    Posted 1 year ago #

    It's a theme css issue...

    In your very oddly named "sccss" file, change line 6 to:

    .products li {
        float: left;
        list-style-type: none;
        width: 33%;
    }
  3. jaydipsinh.parmar
    Member
    Posted 1 year ago #

    use <body<?php body_class(); ?>> after in header.php after check it's work or not

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WooCommerce - excelling eCommerce
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic

Tags

No tags yet.