Hi,
I am using the p-select button control like so
<div class="ui-g-12">
<p-selectButton [options]="types" [(ngModel)]="selectedType" (click)="clickSelectedType()"></p-selectButton>
</div>
But since i have 7-8 buttons I am unable to keep them in a single row.
What should I do so that they keep in row and width stays responsive as well?
Multiple p-selectButton not staying in a single row
Forum rules
Please note that response time for technical support is within 3-5 business days.
Please note that response time for technical support is within 3-5 business days.
We use ui-buttonset-* class for buttons width. For examples;
Therefor, you can add the below code in your stylesheet for 8 buttons;
Code: Select all
.ui-fluid .ui-buttonset.ui-buttonset-1 .ui-button {width: 100%;}
.ui-fluid .ui-buttonset.ui-buttonset-2 .ui-button {width: 50%;}
.ui-fluid .ui-buttonset.ui-buttonset-3 .ui-button {width: 33.3%;}
Code: Select all
.ui-fluid .ui-buttonset.ui-buttonset-8 .ui-button {width: 12.5%;}
@media (max-width: 640px) { //for mobile
.ui-fluid .ui-buttonset.ui-buttonset-8 .ui-button {
width: 100%;
}
}
-
- Information
-
Who is online
Users browsing this forum: No registered users and 22 guests