-
Book Overview & Buying
-
Table Of Contents
Primefaces Theme development
By :
You might frequently want to override the predefined PrimeFaces styles with customized values. Just changing the default values of the PrimeFaces CSS classes won't affect a web page.
You can override the CSS styles in the following two ways:
This is the simplest solution. Add an important keyword to the CSS properties in order to override the CSS styles, as follows:
.ui-message-info, .ui-message-error, .ui-message-warn, .ui-message-fatal {
border: 1px solid;;
margin: 0px 5px;
padding:2px 5px;
}Let's override the CSS properties such border, margin, and padding with !important, as follows:
.ui-message-info,.ui-message-error,.ui-message-warn,.ui-message-fatal {
border: 0!important;
margin: 0!important;
padding: 0!important;
}All the preceding CSS properties being reset to zero results in message boxes without dimension styles.
Resource ordering in PrimeFaces is the official way of overriding PrimeFaces styles. Have a look at http://blog.primefaces.org...
Change the font size
Change margin width
Change background colour