Question

I have basic CSS experienced so I would like to know how can I remove a style CSS that was set by Primefaces?

.ui-inputfield, .ui-widget-content .ui-inputfield, .ui-widget-header .ui-inputfield {
    box-shadow: 0 2px 2px #74B2E2 inset;
}

I created my own stylesheet myCustomStyle.css

.ui-inputfield, .ui-widget-content .ui-inputfield, .ui-widget-header .ui-inputfield {
    box-shadow: ?????? (How can I override the styling)
}

Thanks

Answer 1

Use box-shadow:none to reset the box-shadow to the defaults.

See this source for information about the box-shadow property. All properties can be “resetted” by defining the same property, and using the default value.

To get your myCustomStyle.css override the Primefaces’ css file, you have to include your custom file after the primefaces’ file.

A last resort: If your custom style doesn’t get applied, add !important after your declaration (but before the semicolon): box-shadow: none !important