AG Grid header template customization

Question

Here's my header template:

headerComponentParams: {
                template:
                `<div class="ag-cell-label-container" role="presentation">
                    <span ref="eMenu" class="ag-header-icon ag-header-cell-menu-button"></span>
                    <div ref="eLabel" class="ag-header-cell-label" role="presentation">
                        <span ref="eSortOrder" class="ag-header-icon ag-sort-order"></span>
                        <span ref="eSortAsc" class="ag-header-icon ag-sort-ascending-icon"></span>
                        <span ref="eSortDesc" class="ag-header-icon ag-sort-descending-icon"></span>
                        <span ref="eSortNone" class="ag-header-icon ag-sort-none-icon"></span>
                        <span class="ag-header-cell-text ${column.headerTitleClass || ''}">
                            <span ref="eText" class="ag-header-cell-text ${column.hideTitleInHeader ? 'hide' : ''}" role="columnheader"></span>
                            <span ref="eText" class="ag-header-cell-text ag-header-t-button" data-translation-key="${column.translationKey}">T</span>
                        </span>
                        <span ref="eFilter" class="ag-header-icon ag-filter-icon"></span>
                    </div>
                </div>`
            }

I need to place my ag-header-t-button at the nearest left space of burger-menu button ("eMenu"), so that the space for headerName must be shrinked a bit from the right side.

How can I do that? Help please!