<div class="container-fluid" #container>
	<div class="row" id="credentials">
		<kendo-textbox-container floatingLabel="User Name" class="app-input">
			<input
				kendoTextBox
				type="text"
				name="inputUsername"
				[(ngModel)]="userName"
			/>
		</kendo-textbox-container>
		<kendo-textbox-container floatingLabel="Password" class="app-input">
			<input
				kendoTextBox
				type="password"
				name="inputPassword"
				[(ngModel)]="password"
			/>
		</kendo-textbox-container>
	</div>
  
	<div class="row" id="application">
		<kendo-textbox-container floatingLabel="Application" class="app-input">
			<kendo-combobox
				[data]="applications"
				[(ngModel)]="selectedApplication"
			></kendo-combobox>
		</kendo-textbox-container>
		<button
			(click)="fetchApplications()"
			kendoButton
			iconClass="fa fa-refresh"
			class="app-input"
		>
			&nbsp;Fetch Applications
		</button>
	</div>

	<div class="row margin" id="servers">
		<div class="col-12">
			<kendo-grid [data]="servers" scrollable="scrollable" height="250">
				<kendo-grid-column field="agentId">
					<ng-template kendoGridHeaderTemplate>
						<p style="font-weight: bold">agentId</p>
					</ng-template>
				</kendo-grid-column>
				<kendo-grid-column field="pid">
					<ng-template kendoGridHeaderTemplate>
						<p style="font-weight: bold">pid</p>
					</ng-template>
				</kendo-grid-column>
				<kendo-grid-column field="state">
					<ng-template kendoGridHeaderTemplate>
						<p style="font-weight: bold">state</p>
					</ng-template>
				</kendo-grid-column>
			</kendo-grid>
		</div>
	</div>

	<div class="row" id="buttons-container">
		<button kendoButton iconClass="fa fa-refresh" (click)="fetchServers()">
			&nbsp;Fetch Servers
		</button>
		<button kendoButton iconClass="fa fa-ban" (click)="trimServers()">
			&nbsp;Trim Servers
		</button>
	</div>

	<div *ngIf="!!fetchApplicationResult" class="row" id="application-result">
		<pre class="col-12">{{ fetchApplicationResult | json }}</pre>
	</div>
</div>

./appserver-manager.component.css

.app-input {
    width: 150px;
    margin: 10px 10px 5px 0px;
}

.margin {
    padding-top: 10px;
    padding-bottom: 5px;
}

::ng-deep label {
    font-weight: unset;
}

.container-fluid {
    display: flex;
    flex-direction: column;
}

 #credentials, #application, #buttons-container {
    padding: 0px 15px;
    justify-content: flex-start;
    flex: 0;
}
#servers {
    flex: 0;
}

#buttons-container button {
    margin: 10px 10px 5px 0px;
}

#application-result {
    padding: 0px;
    margin: 10px 0px 0px 0px;
    flex: 1;
    min-height: 100px;
    overflow: auto;
    border: 1px solid #ccc;
    border-radius: 4px;
}
#application-result pre {
    border: none;
    margin-bottom: 0px;
}