CSS not applied to subsite in FF and Chrome, works in IE

[ravie]

Hello,
I have come across a strange issue. We are running MOSS (MS Office Sharepoint Server) public sites (pulishing sites).
The structure is following:
www.example.com - CZ page - this works OK. I have a Master page saying

<style type="text/css">
@import url(/Style Library/navertica.css);
</style>

and it works in all browsers.

In subsequent sites, i. e. English, under www.example.com/en, I have the adjusted statement:
<style type="text/css">
@import url(/en/Style Library/navertica.css); (the style library is in each site)
</style>

And that is the difference - the subsite, in Internet Explorer, works (you may even try ), but in other browsers, the css file is not applied at all.

I suppose there would be some error in the css or in relative adressing, but can not figure it out. Any help would be GREATLY appreciated

Thanks a lot!
Marek

[edited by: SuzyUK at 7:47 am (utc) on June 30, 2009]
[edit reason] please use example.com [/edit]

[SuzyUK]

Hi ravie and Welcome to WebmasterWorld!

I know you say there is a Style Library directory in each site, but have you actually tried to reach it direct?

www.example.com/en/Style Library/navertica.css

(substitute example.com) for your site

if you can reach it I would suggest removing the space in the directory name [google.com] as they can cause many strange issues.. not saying it will fix this but would urge you to try it if you can.

then let us know
Suzy

[ravie]

Hello Suzy,
I tried pasting the url directly into the browser and the css file showed itself. In addittion, I tried replacing the space with %20 (used in Sharepoint by Microsoft themselves :)) - did not help.
It may be difficult to remove the space or use another library...if we dont ge to another option, I will try....anyway, I am pretty sure that it had worked before :-o
What is strange, even Fiddler does not show any 401 or 404 errors. Just not applying the css.
Is it of any use if I paste the css here? (approx. 10 KB)

[ravie]

Update:
I tried another library (url /s/navertica.css), but no change.

[SuzyUK]

Marek,

hmm weird, I wasn't convinced of that anyway ;) - No I don't think it will help to post the CSS, well not all of it, perhaps just the first 10-12 lines.. if the problem is simply the pages not picking up the whole sheet.

You could, in your subdirectory Style sheet, add a single temporary rule at the top of the sheet.. e.g. body {background: #f00;} - this will help you see as soon as any rules, or the sheet is being picked up

What to try is to validate your HTML for that subdirectory page, also validate the CSS.

also I wonder if it could be related to: this recent post [webmasterworld.com]

[SuzyUK]

another thought.. have you tried linking to the stylesheet instead?

<link rel="stylesheet" href="http://www.example.com/en/Style Library/navertica.css " type="text/css" media="screen" charset="utf-8">

edit, sorry, missed the http://

[edited by: SuzyUK at 9:02 am (utc) on June 30, 2009]

[ravie]

Hi Suzy,
I tried this and it works!

<!--
<style type="text/css">
/**** Overriding styles for branding ~ located in the CSSSTyleLibrary ****/
@import url(/en/Style library/navertica.css);
</style>
-->

<link rel="stylesheet" href=/en/Style%20Library/navertica.css type="text/css" media="screen" charset="utf-8">

I don't know how to thank you enough, you saved my life :)

[SuzyUK]

Marek, you're very Welcome :)

but it was good ol' fashioned guesswork, maybe someone will come along some time and tell us both the 'why'..

[swa66]

Spaces in filenames cause more trouble than they are worth indeed.

If you need to use them, do replace them with %20 in any URL.

If you use them in CSS url() construct, make sure to use the (optional) quotes around the string, escape it with a backslash or URL encode it.

See also: [w3.org...]

My bottom line: don't use spaces in filenames (or directory names).

[ravie]

Yeah...however, Sharepoint replaces this automatically. I tried this previously anyway, I tried creating another library with URL without spaces - nothing. We solved it thanks (again :)) Suzy.
Regards,
Marek