Htaccess mod_rewrite blocking my css

Question

Got htaccess rewriting my links for better seo like this:

Options +FollowSymLinks -MultiViews
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_URI}  .*/([^/]+)/?     [NC]
RewriteCond %{REQUEST_URI}  !index\.php      [NC]
RewriteRule  .*      /index.php?cat=%1 [L,NC,QSA]

which rewrites

http://www.example.com/any/number/of/directories/lastDir

to:

http://www.example.com/index.php?cat=lastDir

but my css isnt working, when i upload htaccess to the server, there is just plain text without images and css

tried adding base tag into html, but its not working

<base href="http://www.example.com/">

Answer 1

You must exclude the css and images from being rewritten with a RewriteCond

RewriteEngine on
RewriteBase /
RewriteCond %{REQUEST_URI} !\.(?:css|png|jpe?g|gif)$ [NC,OR]
RewriteCond %{REQUEST_URI} !index\.php [NC]
RewriteRule ([^/]+)/?$ /index.php?cat=$1 [QSA,L]

Answer 2

try using

Options +FollowSymLinks -MultiViews
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_URI}  .*/([^/]+)/?     [NC]
RewriteCond %{REQUEST_URI} !^(index\.php|robots\.txt|img|font|js|css|scripts) [NC]
RewriteRule  .*      /index.php?cat=%1 [L,NC,QSA]

this will filter out certain file types and directories to make sure that assets are not redirected

Answer 3

I was having this problem as well and found a solution.

If your css / js files are linked with a relative path, your RewriteRule will also affect them. Instead of writing a RewriteCond, you can avoid this by using a path from the root directory. In other words:

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

becomes

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

Where css is a directory in the root directory.