开发者

Two CSS files linked, only one is being used, other is ignored

When loading two CSS files via an include I am only seeing one of them being used. The other isn't being include开发者_Go百科d 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=stylesheet for the jQuery UI stylesheet:

<link href="css/jquery-ui-1.8.13.custom.css" type="text/css"/>

should be

<link href="css/jquery-ui-1.8.13.custom.css" type="text/css" rel="stylesheet" />


You are missing the rel attribute in the first link tag, and most likely this is the reason it's not being parsed as CSS.


Looks like you forgot to close you link tags, just add a forward slash '/' before the closing of both tags.


You're certain the second file is linked correctly? Check Firebug's NET panel, for instance, to double-check that it's loading and not returning a 404 error or somesuch.

You wouldn't be the first developer to be brought down by an unintentional typo!

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜