How to make elements stay in place even if the if directive removes the given element from the middle of consecutive elements

Issue

I need to style rows like in picture.

The problem is I want to have fixed elements no matter if previous or next element will disappear. Also the whole table is resizable and buttons should overlap text if text will be too long

<div class="someRow">
 <div class="someText"></div>
 <div class="buttonsContainer">
  <div *ngIf="someExpression1" class="button1"></div>
  <div *ngIf="someExpression2" class="button2"></div>
  <div *ngIf="someExpression3" class="button3"></div>
  <div class="button4"></div>
 </div>
</div>

Solution

<div class="buttonsContainer">
<div class="row">
    <div class="col-4">
        <div *ngIf="someExpression1" class="button1"></div>
    </div>
    <div class="col-4">
        <div *ngIf="someExpression2" class="button2"></div>
    </div>
    <div class="col-4">
        <div *ngIf="someExpression3" class="button3"></div>
    </div>
</div>

Answered By - Chinmaya Sahoo