title: Category items won't display on a single row
body: <p>I am finishing up a custom Storefront child theme for a client. Yesterday, when I began work, I noticed the homepage category row items were displaying on two rows. I had made no changes to any of the template code or CSS. No matter what I do, I cannot get them to display on a single row. I have removed the float, put float:left back, removed the margins and padding, without any of the changes correcting the way that the category items display. </p>
  
  <p>site url: <a href="https://test.onyour6designs.com" rel="nofollow">https://test.onyour6designs.com</a></p>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.page-template-template-homepage-php .site-main .columns-3 ul.products, 
  .storefront-full-width-content .site-main .columns-3 ul.products {
      width: 100%;
      display: block;
  }
  
  .page-template-template-homepage-php .site-main .columns-3 ul.products li.product, 
  .storefront-full-width-content .site-main .columns-3 ul.products li.product {
      display: inline-block;
      float: left;
      width: 29%;
      margin-right: 0;
  }
  .page-template-template-homepage-php .site-main .columns-3 ul.products li.product:last-child, 
  .storefront-full-width-content .site-main .columns-3 ul.products li.product:last-child {
        margin-right: 0;
  }
  
  Other CSS:
  storefront style.css
  ol, ul {
      margin: 0 0 1.618em 3em;
      padding: 0;
  }
  * {
      box-sizing: border-box;
  }
  
  woocommerce.css
  ul.products {
      margin-left: 0;
      clear: both;
  }
  ul.products:after, ul.products:before {
      content: "";
      display: table;
  }
  ul.products:after {
      clear: both;
  }
  ul.products:after, ul.products:before {
      content: "";
      display: table;
  }
  </code></pre>
  
  <p><strong>Custom PHP (in child theme)</strong>  </p>
  
  <p>storefront-template-functions.php</p>
  
  <pre><code>if ( ! function_exists( 'storefront_oy6d_product_categories' ) ) {
  /**
   * Display Product Categories
   * Hooked into the `homepage` action in the homepage template
   *
   * @since  1.0.0
   * @param array $args the product section args.
   * @return void
   */
  function storefront_oy6d_product_categories( $args ) {
  
      if ( is_woocommerce_activated() ) {
  
          $args = apply_filters( 'storefront_oy6d_product_categories_args', array(
              'limit'             =&gt; 3,
              'columns'           =&gt; 3,
              'child_categories'  =&gt; 0,
              'orderby'           =&gt; 'name',
              'title'             =&gt; __( 'Shop by Category', 'storefront' ),
          ) );
  
          echo '&lt;section class="storefront-oy6d-product-categories phone"&gt;';
  
          do_action( 'storefront_homepage_before_product_categories' );
  
          echo '&lt;h2 class="section-title"&gt;' . wp_kses_post( $args['title'] ) . '&lt;/h2&gt;';
  
          do_action( 'storefront_homepage_after_product_categories_title' );
  
          echo storefront_do_shortcode( 'product_categories', array(
              'number'  =&gt; intval( $args['limit'] ),
              'columns' =&gt; intval( $args['columns'] ),
              'orderby' =&gt; esc_attr( $args['orderby'] ),
              'parent'  =&gt; esc_attr( $args['child_categories'] ),
          ) );
  
          do_action( 'storefront_homepage_after_product_categories' );
  
          echo '&lt;/section&gt;';
      }
    }
  }
  </code></pre>
  
  <p><strong>Rendered HTML</strong>  </p>
  
  <pre><code>&lt;ul class="products"&gt;
      &lt;li class="product-category product"&gt;
          &lt;a href="https://test.onyour6designs.com/product-category/gun-holsters/"&gt;
              &lt;div class="pso-wrap"&gt;
                  &lt;img src="//test.onyour6designs.com/wp-content/uploads/2016/09/custom-gun-holsters-420x350.jpg" alt="Holsters" width="420" height="535" /&gt;&lt;/a&gt;      
                  &lt;div class="pso-title"&gt;
                      &lt;a href="https://test.onyour6designs.com/product-category/gun-holsters/"&gt;&lt;h3&gt;Holsters &lt;mark class="count"&gt;(21)&lt;/mark&gt;       &lt;/h3&gt; &lt;/a&gt;      
                  &lt;/div&gt;
              &lt;/div&gt;
      &lt;/li&gt;
      &lt;li class="product-category product first"&gt;
          &lt;a href="https://test.onyour6designs.com/product-category/magazine-holsters/"&gt;  
              &lt;div class="pso-wrap"&gt;
                  &lt;img src="//test.onyour6designs.com/wp-content/uploads/2014/09/OnYour6Designs_Ruger_SR22_Holster-5-420x535.jpg" alt="Mag Holsters" width="420" height="535" /&gt;
          &lt;/a&gt;        
          &lt;div class="pso-title"&gt; 
              &lt;a href="https://test.onyour6designs.com/product-category/magazine-holsters/"&gt;
                  &lt;h3&gt;Mag Holsters &lt;mark class="count"&gt;(13)&lt;/mark&gt;        &lt;/h3&gt;
              &lt;/a&gt;        
          &lt;/div&gt;
          &lt;/div&gt;
      &lt;/li&gt;
      &lt;li class="product-category product last"&gt;
          &lt;a href="https://test.onyour6designs.com/product-category/on-your-6-gear/"&gt; 
              &lt;div class="pso-wrap"&gt;
                  &lt;img src="//test.onyour6designs.com/wp-content/uploads/2015/06/Gear-420x535.png" alt="On Your 6 Gear" width="420" height="535" /&gt;
          &lt;/a&gt;        
          &lt;div class="pso-title"&gt; 
              &lt;a href="https://test.onyour6designs.com/product-category/on-your-6-gear/"&gt;
                  &lt;h3&gt;On Your 6 Gear &lt;mark class="count"&gt;(2)&lt;/mark&gt;       &lt;/h3&gt;
  
              &lt;/a&gt;        
          &lt;/div&gt;
          &lt;/div&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>UPDATE: I disabled my child theme stylesheet, but the issue persists. I switched to the parent theme, and the category items display in a single row. I have only one stylesheet for the child theme.</p>
  
  <p>UPDATE: Thoroughly checked the custom PHP function for syntax errors and found none.</p>
  
  <p>UPDATE: I removed all custom functions and hooks from the child theme, but still have this problem. it seems like it might have to do with my template-homepage.php file, but I am not sure why. The only change I made to it was to substitute my hooks for the custom storefront template functions.  </p>