Removing primeface's css

Question

any idea on how to replace primeface default css with my own css (without removing all default css styling of the primeface theme). Thank you for helping

Hope this link will help to you. http://stackoverflow.com/questions/10160892/remove-all-styling-from-primefaces-components — ItzMe_Ezhil, May 12 '15 at 12:56
By creating your own css and loading it in your application. Not any different from how you would do that with other existing stylesheets in .e.g. jquery or whatever — Kukeltje, May 12 '15 at 12:57
Possible duplicate of [Remove all styling from Primefaces components?](https://stackoverflow.com/questions/10160892/remove-all-styling-from-primefaces-components) — Kukeltje, Jan 10 '18 at 14:59

luisja19 · Answer 1 · 2018-01-10T16:14:38.290

0

To change the primeface default css you have to put the! important tag in the id or class you want to change. In this way it will take your css and not the default one.

For example

.ui-button-text-icon-left .ui-button-text {
    padding: .3em 1em .2em 2.1em !important;
}

.ui-panelgrid .ui-panelgrid-cell {
    border: 1px solid #E6EDFB !important;
    padding: 4px 10px;
}

.ui-widget-content a {
    color: #0000a0 !important;
}

edited Jan 10 '18 at 16:14

answered Jan 10 '18 at 14:27

luisja19

27
5

Bad suggestion... https://stackoverflow.com/questions/8768317/how-do-i-override-default-primefaces-css-with-custom-styles. And this is about **removing ALL** css... not overriding individual things. – Kukeltje Jan 10 '18 at 14:56

score -1 · Answer 2 · answered May 12 '15 at 12:59

Here you are example with bootstrap library... In the example as you can see it will change the color to red only for .btn class thats in the .form-inline class.

Your css must be the last in html header so it override others.

`http://jsfiddle.net/yzd9o4hc/`

Removing primeface's css

2 Answers2