JSFiddle - React, Tailwind, and code Playground

HTML

<div class="dropdown">
            <div>
                <h2>Top Brands</h2>
                <ul class="topbrands">
                    <li>1</li>
                    <li>1</li>
                    <li>1</li>
                    <li>1</li>
                </ul>
</div>
                   
                        <div> second div </div>
                        <div> third div </div>
                    </div>

<div class="dropdown">
            <div>
                <h2>Top Brands</h2>
                <ul class="topbrands">
                    <li>1</li>
                    <li>1</li>
                   
                </ul>
            </div>
                   
                        <div> second div </div>
                        <div> third div </div>
</div>
<div class="dropdown">
            <div>
       
                <h2>Top Brands</h2>
                <ul class="topbrands">
                    <li>1</li>
                    <li>1</li>
                    <li>1</li>
                    <li>1</li> 
                    <li>1</li>
                    <li>1</li>
                </ul>
</div>
                   
                        <div> second div </div>
                        <div> third div </div>
                    </div>

CSS

.dropdown {
    float:left;
        clear:left;}
.dropdown div {
  
   float:left;
    border: 1px solid black;
    padding: 15px 10px;
    text-align: left;
   z-index: 10;}

JavaScript

$('.dropdown div').each(function(){
    $this = $(this);
    var $height = $this.height();
    $this.siblings("div").css("height", $height);
});