Weird padding in form


I’m making a super simple form with a text input and 2 buttons, using ion-item as rows. First row has the ion-input and the second row has 2 ion-buttons. As you can see from the screenshot, the second row has a weird padding and I don’t understand why.

Is there any reference for form’s markup?

    <ion-label position="stacked">New course name:</ion-label>
    <ion-input required [(ngModel)]="name"></ion-input>
    <ion-button [routerLink]="['/courses']" size="default" color="light">Cancel</ion-button>
    <ion-button (click)="save()" size="default" color="primary">Save</ion-button>

It doesn’t have anything to do with forms. See ion-item’s properties, especially the “lines” one. You can choose “full” (the top item) or “inset” (the bottom one) as you desire. I believe the default hinges on whether there is an interactive input in the item or not (yes on the top one, no on the bottom one).