CSS seems like it doesn't load...but only occasionaly

Hello--I'm trying to solve a problem that I've never been able to reproduce, but my client insists that it happens for them all the time. We've just launched a new site built on PHP and Smarty Templates (I'm posting on this board because I don't think it's a PHP problem...let me know if I'm wrong about that), but with lots of javascript and css.

My client sent me a screenshot (attached) which shows that all of the stylesheet-formatted text is rendered without formatting...it's coming up Times New Roman with default colors. (Please ignore the blue boxes...I masked the identifying features of the image to protect the innocent :-) ). This goes away upon refresh, but it seems to happen (though never to me) often enough that we're worried about it.

Has anyone ever seen anything like this? I'll be happy to reproduce any code that anyone's interested in, but I wasn't sure where to start and I didn't want to have to display a bunch of irrelevant code. I searched the boards but couldn't find anything.

Thanks in advance.

Michael Schmidt

Are you using @import in your stylesheets? Doing so can cause this behavior in certain browsers. Just use multiple <link>s instead.

Thanks for your response. I'm actually using only one call to the style sheet:

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

I did notice, that because of the way we have our templates set up that there's javascript scattered throughout the page. I've read in other places that this could affect the performance of the page rendering. Do you think there's any way that this could occasionaly disrupt the download of the css?

I'm a server-side guy who's found himself dealing with front end issues for the first time, so thanks for your help and your patience.

Do you use CSS to do any positioning? and if so, is that being rendered correctly when the rest is not?

Are those unformatted links at the top part of a JavaScript drop down menu? Looking at your screenshot, IE is indicating a JS error (if I remember IE correctly). Make sure to turn them on (or double click the ! icon in the status bar) and see what the error is. It's possible there are JS errors causing your HTML to not render completely and thus, your CSS isn't being applied.

Yeah, it's definitely a javascript error. The problem is that I can't duplicate it to see what it is. I will, however, alert my client to note the error and also save the page source.

CSS is only being used for text formatting, and what you're seeing across the top is css formatting within javascript menus. There are, however, other bits of text that aren't javascript related that are also displaying incorrectly.

I think you may be right about javascript errors. Looking at the source there really is javascript everywhere. Are there any rules about where in the page to put js? Or could you recommend a source where I could get a primer on this kind of thing.

Once again, thanks.

I rarely use JavaScript, so it's difficult to give you any more specific help. I recommend you get the user's browser type <i>and</i> version. I would then search Google for quirks specific to that browser version. If the JS drop down menu is a third party's, I'd check the documentation for browser conformance.