Remove border from all PrimeFaces p: panelGrid components

Question

I need to hide all borders of all panels using performances. I tried it without consequences:

table { border: none; } table tr, table td { border: none; }

What can I do?

+5

css jsf border primefaces

John Alexander Betts Sep 19 '13 at 14:37

source share

5 answers

This solution only affects the grids, but dataTables:

 .ui-panelgrid > * > tr, .ui-panelgrid > * > tr > td.ui-panelgrid-cell { border: none; }

Thanks to the answer posted by Kukeltje here: Remove the entire frame on all panels outside the datatables

+1

John Alexander Betts Jul 16 '15 at 13:38

source share

Your CSS may have been rewritten somewhere else. You can try to use the rule !important .

 table, table tr, table td { border: none !important; }

0

LinkinTED Sep 19 '13 at 14:40

source share

Tested on connectivity 5.1

 .ui-widget-content { border: none; }

-one

xav56883728 Nov 07 '14 at 12:45

source share

This work in Primefaces 5

 .ui-panelgrid-content { border: none; }

-one

Alexander Cedeño Jun 08 '15 at 16:50

source share

BalusC · Accepted Answer · 2013-09-19 17:10

You need to be at least as specific as the default PrimeFaces selector.

 .ui-panelgrid>*>tr, .ui-panelgrid .ui-panelgrid-cell { border: none; }

Do not use !important unless you need to override the hardcoded style in the HTML element.