When loading two CSS files via an include I am only seeing one of them being used. The other isn’t being included and I don’t know why.
I have a standard header file which is included on all of the site’s pages.
Example below:
<html>
<head>
<link href="css/jquery-ui.css" type="text/css" />
<link href="css/main.css" rel="stylesheet" type="text/css" />
</head>
This is of course a cut down version of the header for simplification. As you can see both CSS files are within the css directory. but only the main CSS file is being recognised.
Either one of the CSS files cannot be loaded (probably because of a typo or a server misconfiguration). You can detect that by checking that all resources are properly loaded in the developer tools of your browser.
The other cause may be that you’re implicitly expecting your own stylesheets to take precedence over the default jQuery UI ones. If that’s the case, move your own stylesheets under the jQuery UI one, or make your rules more specific than the default ones.
This is a simple demo that shows that your example works.
Solution:
In your live example, you’re missing
rel=stylesheetfor the jQuery UI stylesheet:should be