CSS does not work on pages generated with Errordocument

Question

I’m having a problem when I’m customizing ERROR 404. I put the following code in the . htaccess file:

ErrorDocument 404 /erro404.html

And I created a custom page error404.html. The page is onpage, there is no link to other pages.

When I type e.g. meusite/contact falls into erro404.html, so far so good. But when I type for example. meusite/contact/ (bar) it does not pull the css (gets all unknowable). What can be?

Answer 1

Change the links in your css to point to the server root, for example, if this is the case:

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

Change and put like this:

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

See that there is a difference in href, has a slash at the beginning, this indicates that your css file is inside the css folder that is at the server root.

Answer 2

Add the following html code to your erro404.html page:

If css, js and images folders are at the root:

<base href="/">

Or you could try this:

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

This tag points to that the Resources click as if they were on the page specified in <base>.

_{Source: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base}