CSS is not loading if there is anything after segment_1. This includes a trailing slash or an entry id. This happens on ANY template on this site but not other sites on the same server with the same .htaccess.

EG: "...//example.com/projects/" or "...//example.com/projects/4" will not render CSS in browser

The template will still parse the EE tags but seems to not be sending the CSS to the broswer despite the code showing in the rendered HTML.

Live example: "http://getyourtips.in/projects/"

Setup --

Template Group: projects

Template: index.html

Version: EE 2.6.1

CSS Theme: Unify (Bootstrap Based)

up vote 4 down vote accepted

You need to add a forward slash to your assets.

Change this <link rel="stylesheet" href="assets/css/style.css">

to this <link rel="stylesheet" href="/assets/css/style.css">

  • Fixed. Thank you so much. That is the first time I have seen that. I wonder why it causes an issue since the path for the CSS in the rendered HTML is valid. – Cheyney Aug 9 '13 at 2:10
  • FYI: Just noticed that no slash before "assets" also causes the logo not to load. Strange because the Javascript loads without having a slash before "assets". – Cheyney Aug 9 '13 at 2:16
  • Scratch that last comment... The Javascript does NOT load with the leading slash before "assets" – Cheyney Aug 9 '13 at 2:36

It doesn't work because if you omit the initial slash then the path is relative to the current page.

The first slash basically says, "start from the site root". So no matter where you are within the filesystem the link "/assets/css/style.css" will always resolve to the correct place.

If you are at "/mypage/something" and you call "assets/css/style.css" you are effectively looking for "/mypage/something/assets/css/style.css" which is going to be incorrect.

It's not an ExpressionEngine issue, it's a basic principle of how URLs and filesystems work.

  • Thanks for the clear explination. However, this "theme" runs fine when it isn't processed through EE. If anything has a path statement , I need to have the leading slash. I wonder why this happens inside EE and not out? – Cheyney Aug 10 '13 at 7:43
  • Here is the theme: htmlstream.com/unify/page_home1.html I'm pretty sure that code has no leading slashs. It works just fine outside of EE. – Cheyney Aug 10 '13 at 7:48
  • Every page in that 'theme' is at the same level in the file system and so is also at the same level as the assets directory. If you have "segment_2" then your "pages" aren't at the same level. Again, this is nothing to do with EE really, it's just how filesystems work. – foamcow Aug 10 '13 at 11:44
  • " If you have "segment_2" " DOH! I just han't been thinking on that level. Upon further checking, it was the home page working that had me fooled at first. Thank You. – Cheyney Aug 10 '13 at 13:55

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.