显示:表单元格绝对定位查询

我正在为 wordpress 构建一个下拉菜单，我遇到了一个有趣的困境。当您将鼠标悬停在显示所有类别的"商店"上时，我有一个下拉菜单，并且从它们的突出显示类别中，会在下面的div 中显示 5 个随机产品，这些产品将跨越菜单栏的整个宽度。这工作正常

然而，当时的客户决定他需要比那里更多的类别，我不得不将它们分解为子类别。

菜单当前的工作方式如下：

悬停商店 -> 显示主要类别悬停类别 ->显示子类别。

这部分工作绝对正常;但是显示子类别的列表是使用 css 表设置布局的，以使子类别列表均匀分布在菜单大小上。你可以在这里看到我的意思的例子。

以前，我没有使用 css 表设置，因为菜单很合适。包含类别产品的下拉div 工作正常。现在它们在 css 表标记中，即使它们没有被定义为这样，似乎也"假装"是表格单元格。产品的每个下拉菜单都作为空白区域放置在每个子类别的右侧。但是因为它们被设置为均匀分布，所以看起来很奇怪。

所以我有两个问题：首先; 尽管绝对显示，但下拉产品部分 - 不会 - 去我需要它的地方。有没有办法将这些从表格布局中分离出来？

其次，如果没有，无论我有多少个子类别，我还有什么其他选项可以使这些类别在父div 中均匀显示？我考虑的一个选择是使用 javascript 计算出所需的宽度百分比，然后将其直接应用于 li，但我不确定这有多可行。

$args = array(
     'taxonomy'     => $taxonomy,
     'orderby'      => $orderby,
     'show_count'   => $show_count,
     'pad_counts'   => $pad_counts,
     'hierarchical' => $hierarchical,
     'title_li'     => $title,
     'hide_empty'   => $empty
);
$all_categories = get_categories( $args );
$categorycounter == 0;
foreach ($all_categories as $cat) {
if($cat->category_parent == 0) {
    $categorycounter = $categorycounter + 1;
    $categorypadding = "";
    $category_id = $cat->term_id;       
    echo $categorypadding . '<li class="category-' . $categorycounter.  '"><a class="main-nav-link" href="'. get_term_link($cat->slug, 'product_cat') .'">'. $cat->name .'</a><div class="drop-down-'. $cat->name .'"><section class="drop-down-section"><section class="sub-list">';
// set up subcategories to display below main categories
              $IDbyNAME = get_term_by('name', $cat->name, 'product_cat');
              $product_cat_ID = $IDbyNAME->term_id;
                    $args4 = array(
                   'hierarchical' => 1,
                   'show_option_none' => '',
                   'hide_empty' => 0,
                   'parent' => $product_cat_ID,
                   'taxonomy' => 'product_cat',     
                    'posts_per_page' => -1
              );            
            $subcategoryloop = get_categories( $args4 );        
            $subcount = 0;
            foreach ($subcategoryloop as $sc){
            if($subcategoryloop){
                $subcount = $subcount + 1;
            $link = get_term_link( $sc->slug, $sc->taxonomy);
            echo '<a class="subme" href="' . $link . '">'. $sc->name .'</a><section class="drop-down-products">';

                                //set up subcategories to display products   
                                        $args2 = array(
                                        'posts_per_page' => -1,
                                        'product_cat' => $sc->slug,
                                        'post_type'=>'product',
                                         'orderby' => 'rand'
                                  );    
                                $productcount = 0;
                                $loop = new WP_Query( $args2 );
                                while ( $loop->have_posts() ) : $loop->the_post();
                                            $productcount = $productcount + 1;
                                            if($productcount < 6){
                                            echo "<section class='thumbcontainer'><p><a href='";
                                            the_permalink();
                                            echo "'>" ;
                                            the_title();
                                            $feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
                                                echo "</a></p><img src='" . $feat_image . "'/><br/><p class='dropdown-price'>";
                                                $price = get_post_meta( get_the_ID(), '_regular_price', true);
                                                echo "&pound;" .$price;
                                                echo "</p></section>";

                                            }
                                endwhile;
            echo "<section><a class='view-more' href='". get_term_link($cat->slug, 'product_cat') ."'>View More Products</a></section></section>";

            }
            }
echo "</section></section></div></li>";
 }
 }

作为旁注，我知道我的代码很混乱。不好意思！