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').each(function(){     
    $this = $(this);
    var $div = $this.find("div:first-child");
    var $height = $div.height();
    $div.siblings("div").css("height", $height);
});