.content-area { height: 80%; display:table; } .button-container { height:100%; vertical-align: middle; width:20px; display: table-cell; } .page-button { // fills sidenav-button-container completely, so all is one button height: 100px; min-width: unset; // needed because angular sets an own min width!? width: 15px; display: flex; justify-content: center; align-items: center; margin: 0; padding: 0; } .info-container { height:100%; vertical-align: top; align-content: left; align-items: left; display: table-cell; padding: 10px; } .right-outer-element { margin-right: 3em; } .right-inner-element { margin-left: 1em; } .mat-button-toggle-group.mat-button-toggle-group { display: flex; align-items: right; }