1

i'm using MAMP on my MacBook Pro as a local server. PHP and MySql are running fine. However, i have a strange issue with CakePHP - CSS only works on homepage of my site and only by the two following paths: 'localhost' and 'localhost/index.php'

Using 'localhost/index.php/' however returns just the bare unstyled markup as does all other pages in the site. How can a slash a the end break the CSS?

A few searches have suggested this could possibly be a mod rewrite issue in apache, but i'm out of my depth to be honest - i don't know how to test if changes i make turn mod rewrite on.

As CSS works only for 2 specific paths, could it perhaps be a problems with my routes? I only have 2 defined - '/' and '/index.php/' - and they are both the same.

Any help will be greatly appreciated, James

1
  • Please show the code you use to add the CSS to the layout. Chances are that you're using relative filepath instead of an absolute path. Commented Nov 2, 2011 at 8:57

3 Answers 3

1

It looks like your MAMP configuration (or Apache within MAMP has mod_rewrite disabled. It looks like you have to follow http://documentation.mamp.info/en/mamp-pro/advanced-functions/edit-configuration-files instructions, edit template for apache's httpd.conf, search for mod_rewrite and uncomment this line in config template.

Sign up to request clarification or add additional context in comments.

2 Comments

This is unlikely the case here -- CakePHP doesn't use prettified URLs to serve CSS files.
CakePHP uses .htaccess to route things to app/webroot dir where dispatching process for code starts, and - all assets are usually stored. So, when assets are accessed using path like domain.com/img/whatever.jpg - it's either has to be handled through mod_rewrite, either will require full path (/app/webroot/img/whatever.jpg) specified. This relates to css and js as well.
0

The problem is most likely as tbwcf says that you're trying to load the CSS files using relative file paths, but you should always use CakePHP's helpers to add resource files to the layout:

<?php echo $this->Html->css('style'); ?>

The above will output

<link rel="stylesheet" type="text/css" href="/css/style.css" />

The benefit is that if you install the app to some other directory the path changes automatically:

<link rel="stylesheet" type="text/css" href="/other/directory/css/style.css" />

Do not use relative file paths like ../css. It will break the layout again in all but the simplest cases.

Comments

0

The slash at the end of the markup is most likely breaking the file path to your stylesheet. For example if your css is referenced as

<link rel="stylesheet" href="css/stylesheet.css" />

then adding the slash to the page URL would mean you'd need to jump back a step to get to the same stylesheet as it would no longer be in the same folder as the page you're on.

So you could add

../ before the reference like <link rel="stylesheet" href="../css/stylesheet.css" />

Or possibly an easier solution in this case would be to reference your stylesheet absolutely like:

 <link rel="stylesheet" href="http://localhost:8888/project/css/stylesheet.css" />

1 Comment

Thanks for everyone's replies. It turned out to be due to relative paths. I changed the CSS path to absolute which made no difference. I then changed the jquery path to absolute as i am using the less css framework and semantic grid system. This fixed my problem.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.