JSFiddle - React, Tailwind, and code Playground

HTML

<div id="listing_header">
    <a href="#">
        <span class="float_left w216px">
            Colonne 1
        </span>
        <span class="float_left w74px">
            Colonne 2
        </span>
        <span class="float_left w82px">
            Colonne 3 Multi-lignes
        </span>
    </a>
</div>

CSS

#listing_header {
	background-color: #fff;
}
#listing_header > a {
	display: table;
    border-spacing: 3px  0;
	height: 48px;
    text-decoration:none;
}
#listing_header > a > span {
    background-color: #aaa;	color: #fff;
	line-height: 1.2em;;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
    display:table-cell;
}
#listing_header > a + a  {

}
.w216px {
	width: 216px;
}
.w74px {
	width: 74px;
}
.w82px {
	width: 82px;
}