Theme / CSS not being recognized properly?

[NickThissen]

Hi,

I've just started a new website, downloaded a free theme from some website and I'm trying to implement that into an ASP.NET web application.

I simply copy/pasted the CSS and I'm now bringing in parts of the webpage bit by bit, starting with the header and title, then a menu bar, a ContentContainer and finally the footer.

When in the VS designer the page looks fine. The background image for the header shows up, the menu bar has its own designated space and separate background image, and the content is separated from the rest by a wide margin.

When I run the web application however, it looks nowhere like that in my browser. The header and menu background images are gone; the margin around the content is gone, etc. It seems about half the style elements are intact while the other half is somehow missing.

Things I've done and tried:

• Confirmed that the correct CSS file is used for the master page
• Refreshed the page a couple times, even cleared the cache and used different browsers to make sure that it's not using an old cached version or something
• Clean solution / Rebuild / Build, etc...
• Restart VS
• Shout at it

This problem seems to pop up from time to time, I've never been able to figure out what causes it and it usually resolves itself... This time it seems persistent though, nothing fixes it.


What could cause this? I am hesitant to say there's errors in the CSS file for two reasons:
- I have ReSharper 6 installed which checks CSS files for errors, warnings, etc, it does not find any
- It works in the VS designer!!!

I suppose I could post the source but the CSS is quite large so that would be like searching a needle in a haystack. Also, because it works in the designer I feel there must be something else going on...


Anybody have any idea what could be causing this behavior?

Thanks!

[sapator]

Ye, your got it all backwards here.The designer is the worst kind of thing you can rely on when your are designing in VisualStudio (btw your version is?).
I propose you run this through firefox first and iexplorer9 after(although,you know, iexplorer and stuff, but not sure if 9 is ok).
Now, unfortunately we have to see some html and CSS to help.I propose you take it step by step, starting with the outer elements (body,header,site background etc) and getting to the inner ones.When you debug and you see problems you cannot fix whatever you try then post back here and we will try to help.
At this point i suggest that if you have dreamweaver available then give it a try also.It has some standard layouts that i have used to build some pages that it could take me quite a few time if i started them on my own or copy pasted CSS and tried to integrate.
Another note is that if you change, mostly images, you may want to clear the cache of the browser because you may get the old image again instead of the new one.

[gep13]

Hello,

I have to agree with sapator here (that makes a change )...

The Visual Studio designer attempts to do a good job of showing you what you will get when your website is rendered in the browser, but the simple fact is, it can't account for everything, and in the end, you can't trust it. In a normal day I will normally only ever switch to the design view in Visual Studio if I want to quickly drag and drop some things onto the page and set a few properties, everything else is done in the code view. Now I am not saying that you have to make that switch, but what I am saying is, don't trust the design view to show you what you are going to get on the screen.

The other main issue that you might be running into here is the issue of caching of CSS files. By default every browser tries to speed up the page loading time, and it does that by caching everything that it can on the client. This means things like images, CSS files, and JavaScript files all get cached on the client. However, when you make a change to one of these items you have to make sure that the browser picks these changes up, and doesn't use the cached version. The simplest way to do that is to clear the temporary internet files for the browser that you are using, but it sounds like you have already tried that.

Another "trick" that I use is that if I am making a change to a CSS file and I want to make sure that it is actually being picked up is that in addition to making the change that I want, I will also change something that is REALLY obvious. The background colour of the body is a good example. Change this to something really annoying to lime green or something. That way you know if the background colour changes, that your other changes will have as well (assuming the changes are contained within the same CSS file).

Is you are using FireFox, then FireBug can be a great help as well, as it allows you to change CSS on the file, so you can alter the CSS in the browser, noting the changes that you have had to make to get it to work, and then you can transfer those changes back into the CSS file in your website.

Hope that helps!

Gary

[NickThissen]

Thanks for the replies. I didn't get any email that there were any replies so I never noticed...

Anyway, I already tried clearing the cache, and I'm also using FireBug (well, the Chrome version of it).

The problem in the end was that the CSS file for some reason was reverting to an old version at seemingly random times, within the VS editor. As I said I found a theme I liked and was copying parts of that CSS file to my own CSS file. The image paths were wrong however (they used 'img' where I use 'Images'), so I changed those, saved, then ran the web application, and it never worked. When I looked at the CSS again, the 'Images' had changed back to 'img'... :S I still don't know why it happened, it kept happening a few times... I think a PC restart made it go away; it seems to work fine now... Computers are strange sometimes

[gep13]

Computers are strange sometimes

Ha ha, very true!!

As for the lack of email notifications, you might want to keep an eye on this, if this continues to happen, let me know and I will get Brad etc to have a look.

Gary

[NickThissen]

As for the lack of email notifications, you might want to keep an eye on this, if this continues to happen, let me know and I will get Brad etc to have a look.

It happens only very occasionally (I did get an email this time) and seems to happen to arbitrary threads. Sometimes it's a thread I created, sometimes a thread with hundreds of replies (many of which are mine). They always appear in the Control Panel (User CP) but sometimes it seems no email is sent.

[gep13]

Hmmm, very bizarre. I could understand what was going on if it didn't also appear in the User CP (i.e. you aren't subscribed to a particular thread) but the fact that you are getting notifications in User CP means that you should be getting email.

Like I say, keep an eye on it, and if it gets worse, let me know and I will chase with Brad, etc.

Gary