Url rewriting broke link to css

php html css .htaccess url-rewriting

15,221

Solution 1

I think you have two problems (as the given answers didn´t solve your problem yet...):

You are rewriting all file-names so when the browser is requesting css/index.css your rewrite transforms that to index.php?url=css/index.css. @cOle2's answer should solve that.
You are not using absolute paths for your css files. The server is translating the requested page like /user/id/1/name/bobby to /index.php?etc.... but when the browser requests for example the css file that is something like css/index.css in your code, it will actually request /user/id/1/name/bobby/css/index.css and that file does not exist. You can solve that by using only absolute paths to your external files (css, js, images, etc.) like /css/index.css.

Edit: Based on your comments, both your paths are relative and your css is not accessible by the browser, so you need to:

Move the css to the project/public directory (like project/public/css)
Use absolute paths to your css like /css/index.css.
Make sure the urls to your external files are not rewritten by the server.

Solution 2

Comment doesn't let me format the code, can you please try this:

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !^.*\.(css|jpe?g|gif|png|js|ico)$ [NC]
RewriteRule ^(.*)$ index.php?url=$1 [QSA,L]

Update

You can try something like this in the <head> section of your pages to support relative path for your image/css/js files referenced on that page:

<head>
<base href="http://www.example.com/static-files/" />
</head>

Solution 3

You can try removing certain file extensions from the rewrite rule, for example the following rule will disregard images, css and js files.

# Do not process images or CSS files further
RewriteRule \.(css|jpe?g|gif|png|js|ico)$ - [L]

Edit: This is how I would apply it:

RewriteEngine On
RewriteRule \.(css|jpe?g|gif|png|js|ico)$ - [L]
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)$ index.php?url=$1 [QSA,L]

15,221

Author by

Shoe

I like C++, Haskell, PostgreSQL, Prolog and you.

Updated on June 04, 2022

Comments

Shoe almost 2 years
I'm using the following setting for url rewriting:
```
RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^(.*)$ index.php?url=$1 [QSA,L]
```
In index.php is parse $_GET['url'] so that in the following examples:
```
ROOT/user/id/1/name/bobby // user is the page, id = 1, name = bobby
ROOT/blog/post/123/title/welcome // blog is the page, post = 123, title = welcome
```
So that the first parameter(? i don't know how to call it) is the page name then the following couple of parameters are like "keys/value". Now when i browse ROOT/ the link to stylesheets that are inserted inside the html of the page and the page are shown correctly. I fi browse ROOT/index (which is the same as ROOT/) it shows the page (with contents and other stuff) correctly but the links (even if in the html structure are correctly written) to stylesheets are not loaded. And i can see that from the fact that my page has no css at all when i load it.

How can I fix this?

EDIT

The css file's path is as follows:
```
project/view/css/common.css
```
The file where is it included is in
```
project/public/index.php // the one with .htaccess and rewrite rules
```
This brings me to make a link (inside the index.php) such as
```
../view/css/common.css
```
But this works different depending on how the url seems. For examples:
```
# For URL = public/
project/view/css/common.css // good
# For URL = public/index/
project/public/view/css/common.css // broken
# For URL = public/index/key/value
project/public/index/key/view/css/common.css // broken
```