CSS not displayed depending on page - css

I have a friend that has a really strange issue with my website. When he clicks on http://www.copeo.fr/ the page displays fine but when he clicks on a link like www.copeo.fr/user/ the CSS is not applied even after a refresh. The raw html does display.
I asked him to display the CSS that is hosted on amazon S3 hcopeoressources.s3.amazonaws.com/style/futurvert/style.css and it displays fine.
The code validates on W3C validator so does the CSS. I am lost what could be the origin of the issue. Could it be its enterprise cache? configuration of IE7 on his machine?
If it happens to someone else who could explain the issue to me, I am all hears.
Thanks

Ok got my answer. The firewall blocked the CSS that is stored on amazonaws and for the first page, it was a cache that was filled outside of the company firewall.

Sounds like he is using relative path names. /foo/bar.css will resolve to sitename.com/foo/bar.css but foo/bar.css will resolve to sitename.com/currentpath/foo/bar.css.

There is an IE bug that if you have more than 30 style sheets, some or all of them won't show:
http://support.microsoft.com/kb/262161
It could possibly have something to do with that.

When I hit the CSS URL I got:
"This XML file does not appear to have any style information associated with it. The document tree is shown below"
We use S3 at work for this type of thing and don't have issues, but I think pulling the CSS file off amazon S3 and storing it on a more traditional server might help with your trouble shooting. Or even solve the issue.

Related

Logos missing after Wordpress migration

For some reason I cant find a place to edit the header logo. The logo will appear in chrome browser. In most browsers, it will just be a blank square and say logo.
This all happened after a migration to a different server/database.
There is some info about plugins needing an authentication key. However, Im unsure if this is the problem as it requires purchase. Any ideas? Thank you!
It's a bit unclear on why this would happen as there are a number of reasons.
Here are a few main things to check:
Did the wp-content/uploads/ folder get copied across fully?
If point-1 is correct, can you access the logo file via URL?
Are you using a theme builder to add in the logo? If so, you might need to export and import a theme builder file.
No need to purchase anything. Since you mentioned that this happened after migration. This could be a source issue, the url of the image could be broken or still leading to the old website url. You can check this by going to the DevTools on chrome by tapping F12. Then, click colsole to check if there's an error and let us know about it.

CSS rendering issue on Chrome

I have been searching online but could not find an answer. Basically, I have a CSS file but the font color couldn't render when the page was first loaded. This only occur in Chrome. The font color would only be back after I press inspect or check or uncheck any one of the properties. How could I go about resolving this issue. I have added a versioning to the back of the CSS such that would not store cache. I am doing this on asp.net that host on sharepoint server. Greatly appreciate if anyone could give me a clue. I cannot post anything due to confidential matter.

Troubleshooting Styled Media Receiver css

I'm trying to implement styled media receiver, but for some reason, my chromecast won't show the graphics. I get only name of my receiver on black background. Preview in cast dev console looks OK though.
The css I'm trying to use is this: https://krizan.se/styl_latest.css
What I tried and did not help:
CORS enabled and disabled, doesn't make a difference. Left it enabled. Verified by streaming video from the server on chromecast
I tried using both absolute and relative paths for images, no change.
Tried using both http and https, no change either.
The image I'm using is 1280x720, as in guidelines. Tried changing it to different sizes, no change
Remove and register my chromecast again in dev console, no change
I spent too many hours trying to fix this, trying all combinations of above, but still can't see my graphics on my cast device. There was one question on stackoverflow with the same issue, but without answer.
Is this some kind of bug or am I doing something wrong? Any help greatly appreciated.
You don't appear to have a valid certificate for the HTTPS connection. Also, the URL is currently returning 404 for the CSS file.
So my problem was that url that was hosting the CSS file was not the raw CSS file. So i used this website https://rawgit.com/ to host the CSS file.

Google Chrome Inspecting Issue. Not showing CSS paths for local files

I am having very unexpected problem on my Google Chrome inspector today. When I was inspecting my local HTML files I noticed I was unable to see from which css file, my classes were coming from. It's very strange because it's always showed it before. Here is the Screen shot
But if I inspect the web form not from Local it shows the files:
Why it's doing this? Is it doing it because of any recent Updates of Google Chrome ? How I can make it work for Local files too ? I need it badly.
Thanks
I just fixed this issue by referencing source maps relative to the workspace root. See my answer here for more information.
I had the same problems as you.
Try to uncheck "Enable CSS source maps" in the "Sources" group of "DevTools settings".
I suppose that one is for SASS/LESS files, but for some reason it affects normal CSS files as well.
This seems to be a bug. See https://crbug.com/422073 to track the progress on this issue and comment there if you have additional information. I am not able to reproduce this problem so far.

CSS seems to be not working in a subdomain?

I developed a website using code igniter, styled it with CSS, locally it works fine but online it looks like css is not loaded it picks up the old css style. I checked the link but it's correct. What gives?
Without more information (such as seeing the site in question), I can't give you a direct answer, but I can give you some pointers.
My suggestion is to use a tool like Firebug (in Firefox) or Chrome's Developer Tools, etc. These tools allow you to see full details of all requests being made by the browser.
(the exact instructions will differ according to the tool you're using, so I'll assume Firebug for simplicity).
Open your page in the browser, with Firebug open, and look at Firebug's "Net" tab (And make sure that the option below the tab is set to "All"). This will list all requests that are made by the browser.
The key thing for you is to look for any 404 errors. Since you say your CSS isn't working, it's a pretty good bet that your stylesheets are failing to load. The 404 errors listed in Firebug will show you why they're failing to load.
If you hover over the filenames, Firebug will expand it to show you the full URL that it attempted to load. This will almost certainly show you that you've got something wrong in your configuration, and it's trying to load the stylesheets (and possibly other files too) from the wrong location. This should show you what's going wrong and give you a enough clues to be able to work out how to fix it.
Hope this helps you solve the problem.

Resources