jsf - Change PrimeFaces DataGrid (responsive mode) behaviour -


it seems datagrid primefaces component (responsive mode) starts out stacked on small devices , becomes horizontal when resolution grows beyond 640 px. want able choose width datagrid columns stop being stacked , start positioning 1 beside other. is, change 640 px default value other value of choice.

thanks.

default breakpoint 35em equals 560px. need override css in primefaces default;

/* responsive */ @media (max-width:35em){     .ui-grid-responsive .ui-grid-row {         display:block;     }     .ui-grid-responsive .ui-grid-col-1,.ui-grid-responsive .ui-grid-col-2,.ui-grid-responsive .ui-grid-col-3,.ui-grid-responsive .ui-grid-col-4,.ui-grid-responsive .ui-grid-col-5,.ui-grid-responsive .ui-grid-col-6,.ui-grid-responsive .ui-grid-col-7,.ui-grid-responsive .ui-grid-col-8,.ui-grid-responsive .ui-grid-col-9,.ui-grid-responsive .ui-grid-col-10,.ui-grid-responsive .ui-grid-col-11,.ui-grid-responsive .ui-grid-col-12 {         width:100%;         float:none;     } } 

source: primefaces pro support queried in private form datatable component of pf 5.2 on june 2015 (similar answer, different css classes, tested these on primefaces 5.3 online showcase)


Comments

Popular posts from this blog

php - Extract Text from HTTP referer -

Receive udp packets in android gstreamer -

authentication - ASP.NET Core 1.0. Bearer Token, cannot access custom claims -