CSS styles ignored

  • Problem:
    JSF page layout defined in a CSS-file is ignored when using PrettyFaces.
  • Solution:
    Fix link to CSS file in non-working JSF’s either by using the relative path, or by providing an absolute path.
  • Further information:
    PrettyFaces page navigation breaks up link to CSS file when page navigation goes to deeper directory levels
    That is because URL’s generated by PrettyFaces do not represent real folder structure on server:
    A multi-level URL like “www.my-domain.net/home/page/entry/1” does not actually refer to the folder structure “/home/page/entry/1”.
  • Code snippets:
    “Normal” link to CSS in a JSF:

    <link href=”css/main.css” rel=”stylesheet” type=”text/css” />

    “Fixed” link to find CSS one level above current (e.g. if page URL is like www.my-domain.net/page/1):

    <link href=”../css/main.css” rel=”stylesheet” type=”text/css” />