How to align ion-segment beside ion-input - Ionic4 - ionic-framework

Question

I am trying to design a calculator for various formulas which may have inputs in different units. Specifically, I need to have this alignment (from left to right):
Essentially, I need to have a "3 column" layout of repeating items.
Below I am providing my form code with my actual results compared to what I am trying to achieve (can't post images yet so I have added links). Thanks in advance for your help!
I have tried using multiple columns in a grid system but this has not worked. I have also tried playing with the "slot".
<form #form="ngForm" (ionChange)="sendUserData(form)">
<ion-grid>
<ion-row>
<ion-col
no-margin
no-padding
size-sm="6"
offset-sm="3"
size-md="4"
offset-md="4"
>
<ion-card color="primary" style="display:block">
<ion-card-header>
<ion-card-title text-center>{{ output }}</ion-card-title>
</ion-card-header>
</ion-card>
</ion-col>
</ion-row>
<ion-row color="primary" justify-content-center>
<ion-col align-self-center size-sm="6" size-md="4">
<ion-item lines="full">
<ion-label (click)="presentAlert()" slot="start" fixed
>Dialysis:</ion-label
>
<ion-label
color="secondary"
(click)="presentAlert()"
slot="start"
fixed
>More Info</ion-label
>
<ion-segment
slot="end"
mode="ios"
no-padding
no-margin
(ionChange)="sendUserData()"
[(ngModel)]="userData.dialysis"
name="dialysis"
>
<ion-segment-button mode="ios" value="true">
<ion-label>Yes</ion-label>
</ion-segment-button>
<ion-segment-button mode="ios" value="false">
<ion-label>No</ion-label>
</ion-segment-button>
</ion-segment>
</ion-item>
<ion-item lines="full">
<ion-label slot="start" fixed>Creatinine:</ion-label>
<ion-input
slot="start"
placeholder="0"
(ionChange)="sendUserData()"
[(ngModel)]="userData.creatinine"
name="creatinine"
type="number"
no-margin
no-padding
></ion-input>
<ion-segment
slot="end"
mode="ios"
no-padding
no-margin
(ionChange)="sendUserData()"
[(ngModel)]="userData.creatinineUnits"
name="creatinineUnits"
>
<ion-segment-button mode="ios" value="umol">
<ion-label>µmol/L</ion-label>
</ion-segment-button>
<ion-segment-button mode="ios" value="mgdl">
<ion-label>mg/dL</ion-label>
</ion-segment-button>
</ion-segment>
</ion-item>
<ion-item lines="full">
<ion-label slot="start" fixed>Bilirubin:</ion-label>
<ion-input
slot="start"
placeholder="0"
(ionChange)="sendUserData()"
[(ngModel)]="userData.bilirubin"
name="bilirubin"
type="number"
no-margin
no-padding
></ion-input>
<ion-segment
slot="end"
mode="ios"
no-padding
no-margin
(ionChange)="sendUserData()"
[(ngModel)]="userData.bilirubinUnits"
name="bilirubinUnits"
>
<ion-segment-button mode="ios" value="umol">
<ion-label>µmol/L</ion-label>
</ion-segment-button>
<ion-segment-button mode="ios" value="mgdl">
<ion-label>mg/dL</ion-label>
</ion-segment-button>
</ion-segment>
</ion-item>
<ion-item lines="full">
<ion-label slot="start" fixed>INR:</ion-label>
<ion-input
slot="start"
placeholder="0"
(ionChange)="sendUserData()"
[(ngModel)]="userData.inr"
name="inr"
type="number"
no-margin
no-padding
></ion-input>
</ion-item>
<ion-item lines="full">
<ion-label slot="start" fixed>Sodium:</ion-label>
<ion-input
slot="start"
placeholder="0"
(ionChange)="sendUserData()"
[(ngModel)]="userData.sodium"
name="sodium"
type="number"
no-margin
no-padding
></ion-input>
<ion-segment
slot="end"
mode="ios"
no-padding
no-margin
(ionChange)="sendUserData()"
[(ngModel)]="userData.sodiumUnits"
name="sodiumUnits"
>
<ion-segment-button mode="ios" value="mmol">
<ion-label>mmol/L</ion-label>
</ion-segment-button>
<ion-segment-button mode="ios" value="meq">
<ion-label>mEq/L</ion-label>
</ion-segment-button>
</ion-segment>
</ion-item>
<ion-button
(click)="clear()"
id="clear"
color="danger"
fill="outline"
expand="block"
margin
padding
>Clear</ion-button
>
</ion-col>
</ion-row>
</ion-grid>
</form>
This is what I get with the above code:
https://i.imgur.com/la0IFXE.jpg
Trying to get something like this:
https://i.imgur.com/3PYWf9I.jpg

Answer 1

Figured it out, for anyone who is curious:
<ion-grid>
<ion-item>
<ion-row>
<ion-col align-self-center size="4">
<ion-label>Creatinine:</ion-label>
</ion-col>
<ion-col align-self-center size="3">
<ion-input (ionChange)="sendUserData()" [(ngModel)]="userData.creatinine" placeholder="0" type="number"></ion-input>
</ion-col>
<ion-col align-self-center size="5">
<ion-segment (ionChange)="sendUserData()" [(ngModel)]="userData.creatinineUnits">
<ion-segment-button value="umol">
<ion-label>µmol/L</ion-label>
</ion-segment-button>
<ion-segment-button value="mgdl">
<ion-label>mg/dL</ion-label>
</ion-segment-button>
</ion-segment>
</ion-col>
</ion-row>
</ion-item>
<ion-item>
</ion-grid>