JSFiddle - React, Tailwind, and code Playground

by amit6june

HTML

<div class="department">

    <div class="vcard">
        <div class="visualPadding">
        <h4 class="fn">
                <a title="" href="#">Amit Mishra1234</a>
            </h4>
            <div>Developer</div>
        </div>
    </div>

    <div class="vcard last">
        <div class="visualPadding">


            <div>Senior</div>
            <a href="#" class="email">E-mail</a>
            <br>
            <div class="tel">Phone</div>
            <a href="#" class="email">E-mail</a>
            <br>
            <div class="tel">Phone</div>
            <a href="#" class="email">E-mail</a>
            <br>
            <div class="tel">Phone</div>
        </div>
    </div>

    <div class="vcard">
        <div class="visualPadding">

            <div>More Title</div>

        </div>
    </div>

</div>

CSS

.vcard {float: left; 
margin: 0 1em 0 0; 
border: 1px ;
solid #999;
background: #bbb}

JavaScript

(function($) {
    $.fn.equalHeights = function(base_height) {
        var itemsbatch = this;
        if (base_height === 0) {
            base_height = Math.max.apply(null, this.map(function() {
                return $(this).width();
            }).get());
        }
        itemsbatch.width(base_height);
        return base_height;
    };
})(jQuery);

$(function() {
    $('.department .vcard').equalHeights(0);
});