i made a custom style sheet named mycustomstyle.css
to override the style sheet provided by primefaces, i placed the link to my style sheet inside the <h:body>
so that it overrides the one provided by primefaces, but when i see the generated HTML i found that mycustomstyle.css
appears before the style sheet of primefaces which means that it didn't override it, this is the generated HTML:
<head><link type="text/css" rel="stylesheet" href="/Gambak/javax.faces.resource/theme.css.jsf?ln=primefaces-aristo" />
<link type="text/css" rel="stylesheet" href="/Gambak/javax.faces.resource/css/mycustomstyle.css.jsf" />
<link type="text/css" rel="stylesheet" href="/Gambak/javax.faces.resource/primefaces.css.jsf?ln=primefaces" />
<link type="text/css" rel="stylesheet" href="/Gambak/javax.faces.resource/keyboard/keyboard.css.jsf?ln=primefaces" />
<link type="text/css" rel="stylesheet" href="/Gambak/javax.faces.resource/fileupload/fileupload.css.jsf?ln=primefaces" />
<link type="text/css" rel="stylesheet" href="RES_NOT_FOUND" />
regarding this order which style sheet overrides the other one? i think that myStyleSheet have been overriden,
my jsf oage code to place the customStyleSheet:
<ui:composition template="/WEB-INF/template/template.xhtml">
<ui:define name="content">
<h:body>
<f:facet name="last">
<h:outputStylesheet name="css/mycustomstyle.css" />
</f:facet>
</h:body>
</ui:define>
</ui:composition>