Ion-items getting center/middle.. not lined up


#1

Another problem with ion-item

I have a row two columns
column one has a drop down list with a label.
Second column is input.

<ion-row>
                    <ion-col col-12 col-sm-9 col-md-6 col-lg-4>
                        <ion-item>
                            <ion-label floating>Questions One</ion-label>
                            <ion-select [ngModel]="question1" name="question1" (ionChange)="selectQ1($event)" >
                                <ion-option *ngFor="let question of questionList" [value]="question.description" >{{question.description}}</ion-option>
                            </ion-select>
                        </ion-item>
                    </ion-col>
                    <ion-col col-12 col-sm-9 col-md-6 col-lg-4>
                        <ion-item>
                            <ion-input type="text" [(ngModel)]="answer1" #answer1Val="ngModel" name="answer1" placeholder="Answer" required ></ion-input>
                        </ion-item>
                        <div *ngIf="answer1Val.invalid && answer1Val.dirty" class="serverErrorRed">
                            Required Value
                        </div>
                    </ion-col>
                </ion-row>
                <ion-row>

On a mobile screen it looks fine. But on a desktop because I’m using floating label column 1 is taller, which makes column 2 also taller. Which then makes the stuff in column 2 centered and not bottom aligned.

[Image]

NOTLinedUP

For the life of me I can’t find the style to get these aligned.
it seems like it has to be in the ion-item style.

I tried adding bottom to both the row and col. No luck.