Dynamic button sizes


Our app has 4 buttons in a 2x2 grid formation. i use 2 rows with 2 columns each. every columns contains the following button

<button class="fa-button" ion-button icon-left clear small full><i [ngClass]="icon" aria-hidden="true"></i> {{ title }}</button>

Now it has small because this actually fits my iphone SE screen, leaving it to default or large will make it run outside of the screen. However running this on a iphone X or a ipad it will still have these relative tiny buttons dangeling in the middle of the screen. I feel a large or default would fit better but messing with screen sizes in the controller and then determining the button size seems a bit hacky. i kinda expected ionic handeling these kind of things for me. Am i doing anything wrong or do you really have to sizing for different screens mannualy ?

With best regards,