I am trying to use some Primefaces functionality in my existing application. I do not want Primefaces to mess with my existing CSS now, so I have tried to disable the theme in my web.xml:
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>none</param-value>
</context-param>
However, PrimeFaces is still rendering all sort of ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left in my elements, which affects my current CSS styles. I do not think it is a good nor elegant solution to move my CSS to the body, and I don't think it is a good solution to use !important either. How can I stop PrimeFaces from inserting all sort of undesired styles?
Your question was a bit confusing at first. The solution you found can only be used to prevent theming, which basically comes down to setting a custom style sheet. This does not change how the components are rendered. As you have noticed, the style classes will be rendered anyway. This cannot be "prevented" (like switched off), but you could override the renderer for the components you want to customize. But be careful though.. it might be that some style classes are needed by JavaScript features!
An other solution could be switching to JSF core HTML or a different component library like BootsFaces or ButterFaces. This depends on the components you need, and you might run into the same issue when using a different library.
Or, you could just stick with PrimeFaces and learn how to override the default PrimeFaces CSS with custom styles. This can be done without any CSS in the body or using !important. Just create a style sheet with more specific rules.