Align 3 buttons in Alert

Hello, i want to align my 3 buttons in my alert, how can I do ?

I try this but it dont’ work :

.alertInput {
	text-align:center;

	button.alert-button:nth-child(1) {
		float:left;
		width: 100px;
	}
	button.alert-button:nth-child(2) {
		display: inline-block;
                width: 100px;
	}
	button.alert-button:nth-child(3) {	
		float:right;
                width: 100px;
	}
}

Ok i find a solution

.alertInput {
	button.alert-button:nth-child(1) {
		color: color($colors, orangé, base);
	}
	button.alert-button:nth-child(2) {
		font-weight: bold;
		color: color($colors, bleu, base);
	}
	button.alert-button:nth-child(3) {
		font-weight: bold;
		color: color($colors, bleu, base);
	}
}

.alertInput button.alert-button-group {
	width: 33.33%;
}

.alertInput .alert-button-group-vertical {
	flex-direction: row ;
}

3 Likes

Ionic 4:
Assuming you named your cssClass:“alert-button-group”
Just add the following into global.scss file. or into app.scss for Ionic 3

.alert-button-group {
  flex-direction: row !important;
}

or

.alert-button-group .alert-button-group-vertical {
  flex-direction: row;
}
1 Like