XenForo widgets horizontally

[wikislo]

Create an HTML widget, choose the position

<div class="grid-main">
    <div class="grid">
        <xf:widget key="online_list_online_statistics" />
    </div>
    <div class="grid">
        <xf:widget key="forum_overview_forum_statistics" />
    </div>
    <div class="grid">
        <xf:widget key="forum_overview_share_page" />
    </div>
</div>

2. Copy/paste this code to EXTRA.less

.grid-main {
    display: flex;
}
.grid {
    display: flex;
    flex-direction: column;
    flex: 1 1 250px;
}
.grid:first-of-type {
    margin-right: 2%;
}
.grid:last-of-type {
    margin-left: 2%;
}
.grid .block, .grid .block-container {
    height: 100%;
}
@media (max-width: @xf-responsiveMedium)
{
    .grid-main {
        display: inherit;
    }
    .grid:first-of-type {
        margin-right: inherit;
    }
    .grid:last-of-type {
        margin-left: inherit;
    }
}