Argh! CSS works locally but not live.

She has: 18 posts

Joined: Feb 2006

Any of you pros want to take a stab at explaining this to me?

I've just made some updates to my site - which included changing/adding some CSS text formatting. All of the changes have been made to the external style sheet and everything looks peachy when I view it locally.

So I uploaded it today - including the amended external style sheet - and some of the formatting isn't working. At first I thought the upload of either the .html or .css hadn't worked properly, so I checked the file locally to make sure I wasn't accidentally uploading an old copy, and ftp'd the 100% definite correct files. Still the same problem. Again I thought the upload had failed somehow (because I can't explain it otherwise) so I've just hit view source on both files on my webserver. They're the right files. Confused I've cleared my cache, forced reloads... and I get the same thing. It's the same browser and I've checked to make sure I haven't been messing around with the default browser settings.

So where the heck is it all going horribly wrong?

Note: The same format works for the copyright section of the page, both live and locally.
<p id="disclaimer">text here</p>'

#disclaimer {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: xx-small;
color: #1A1A1A;
text-align: left;
position: relative;

}
#disclaimer a:link, #disclaimer a:visited {
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: #3D3D3D;
}

#disclaimer a.selected:link, #disclaimer a.selected:visited, #disclaimer a:hover {
color: #000000;
}

#disclaimer a:hover {
color: #DFDFDF;
}
'

Anyone want to hazard a guess or make a suggestion? Or does anyone have any recommendations for hair re-growth products? (Although, I shouldn't need hair re-growth products if I carry on banging my head against the keyboard.)

Thanks in advance,
Blythespirit

He has: 698 posts

Joined: Jul 2005

If I could get a link to the page you are talking about I might be able to find your problem as it may not be in the line specified. Wink

She has: 18 posts

Joined: Feb 2006

enchantedthemusical.co.uk/tickets.html

I'm having a closer look at the code to see if I can find anything unusual. I just assumed it would be those two snippets of code that were causing it.

Thanks for the input. Smiling

Busy's picture

He has: 6,151 posts

Joined: May 2001

The content is displaying ok in Firefox, the copyright section isn't thou, only because the text is black on black.

How did you refresh the cache? hitting refresh on the browser wont always do it, pressing F5 is the minimum it can take

He has: 698 posts

Joined: Jul 2005

It looks fine to me in Opera. I don't see a black on black area though. I don't see any black backgrounds on the page at all in fact. Try Busy's advice. Wink

Kurtis

She has: 18 posts

Joined: Feb 2006

^^This is what I see when I view it live. The text in the red box is what I wanted for the main section of the page. The text in the orange box is the copyright line - and this is 'similar' to what I had wanted for the disclaimer (in the yellow box). The copyright displays correctly (at least on my machine) - regardless of the file being local or online and aside from text size and alignment being altered it is the same CSS as I am using for the 'disclaimer'.

^^This is what I see when I view it locally. This is what I expected to see after uploading the .html and .css files. Identical files, identical browsers, both viewed after pressing F5...

I'm just baffled. I could understand it displaying differently between browsers - but the pages are identical and being viewed in identical settings, except for one is stored locally and the other has been uploaded.Confused

She has: 18 posts

Joined: Feb 2006

Apologies for the double post, but I've just had a thought...

Could it be possible that the browser isn't managing to read the entire .css before displaying? That's almost what it 'feels' like. All of the .css in the file further up the list is working - but it's as though what's further down the list is being missed. I'll do a bit of tinkering and see if changing things around a bit make a difference.

Busy's picture

He has: 6,151 posts

Joined: May 2001

The CSS file could be timing out or erroring if you have bad errors.
You can break the CSS file down into seperate files and validate your CSS at w3c.org

She has: 18 posts

Joined: Feb 2006

Thanks for that advice, Busy. I'll keep it in mind the next time my CSS is playing up.

As it turned out, the client wanted other changes making to that page - and the changes worked - so the issue wasn't a big deal anymore, despite being 'unsolved'.

However, I think I found the culprits. Dreamweaver, an un-updated template and me.

I have 2 basic templates for the site. One of them is used more often than the other. So at some point in time, I copied my local .css files from one directory to the main directory, and only updated the most used template. So the un-updated template was still referencing a style sheet that had the basic layout but was missing any new formatting. Locally it worked because the original .css file was still there and Dreamweaver was updating it. Once it was uploaded it ceased to work because that directory no longer exists - so even double checking and making sure the style sheet was complete (and uploaded in what I *thought* was the right directory) did nothing as I'd told the page to look in the wrong place.

*slaps self with wet kipper* Time to archive some files, methinks. lol Such a simple solution and it drove me absolutely bonkers. When the layout worked and the formatting didn't... the last thing I was thinking was that it was looking at the wrong .css file.

They have: 1 posts

Joined: Jun 2006

I'm having a similar problem concerning some JavaScript for viewing a gallery with onmouseover commands. it previews fine on the computer with both Safari and Opera, but when I go live, the onmouseover command does not work.

does anyone have any suggestions?

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.