Page CSS fails on deployment server - css

I have a page which works locally but when deployed, none of he CSS works. in Firefox I get these errors. I never used to get this before. Any idea why this may be happening?
Also, when viewing the source of the page I can see this
<link href="/Content/css/foo.css?v=1.0" rel="stylesheet">
The resource from this URL is not text: http://foo.iat.company.local/Content/css/foo.css?v=1.0
</link>

The errors you're showing in console seem to suggest that the first line of your JS files is <!DOCTYPE html>, which it shouldn't be for JavaScript files!
I suspect that your links to the stylesheets aren't working and it's instead returning a 404 page (the screenshot certainly seems to suggest it's returning a document with HTML in it).
To try and double-check:
open up the page in Firefox and view source (right-click and 'View
Source');
In FireFox source view the assets URLs will be hyperlinks;
try clicking on the link for one of the JS files and see what gets
displayed.
I suspect you're going to find it returns you an error page and not the JS you expect!
If that's the case, you need to take another look at your folder structure and try and work out why your markup is pointing at the wrong place.

Check what your CSS files stored in correct place. Try open URL to CSS in browser. Also check in Firebug in tab Network what files loaded and from what URL. There is similar to your pages tried load CSS files from incorrect URL and got page for 404 error.

The problem was that the Content folder didn't have permission that it required. I added he following users to the security tab of the properties window of the Content folder and set permissions for those users and it all worked fine.
creator owner
iusr
network service
users
iis_usrs

Related

Firebug shows 404 error for claro_rtl.css, but I can't find the source that is trying to reference that file

I'm in the middle of testing a customized Dojo theme based on the popular claro theme. The new theme is named 'jelam'. I've gone through all the suggested steps for making a new theme based on an existing theme like claro and all seems to be working fine - except Firebug is reporting an error immediately upon opening my page. It reports that it can't find the claro_rtl.css file. The thing is, I've searched many times my source code and files for any reference to that claro_rtl.css file, but I can't find it. I suspected initially that my browser was cacheing it somehow, so I cleared the Firefox browser, closed Firefox and ropened it, and also restarted the WebSphere portal which is serving my JSP page. Despite those attempts to clear out any reference to claro_rtl.css, I'm still getting the error reported in Firebug.
"NetworkError: 404 Not Found - https://localhost:10149/CompassThemesURS/themes/html/commonurs/dojo/1.9.1/dijit/themes/jelam/claro_rtl.css"
How can I get Firebug to show me what the source of that request is? I had initially suspected that I had missed it in one of my many JSP files or CSS files that was possibly importing it, but it's not showing up.
Is there a way to get Firebug to show me who is trying to pull that file in?
Thanks for any insight you can give.
Finally figured it out. In Firebug I put "claro_rtl.css" in the search box, then performed the search in each tab until the search found it from the CSS tab, and it found it referenced in the new jelam.css file.
I had forgotten to redeploy the webapp. I had correctly updated the source files, including jelam.css, but I hadn't redeployed with those updates like I thought I had.
Cheers.

401 unauthorized error access CSS files MVC

First things first, yes I am fully aware this has been addressed here before, however none of the solutions seem to resolve my issue. My problem is simply that I have created a new web project and everything works fine with the default code template that VS2013 has provided, the problem I am currently runing into is adding my own CSS files. This is the process I went through to add them:
added CSS folder under the already existing Content directory
Linked to CSS files in the header CSHTML (I can be sure it is linked properly as it is not a 404 error
but when i run the project i get: Status Code:401 Unauthorized (pulled form the network explorer in chrome dev tools), nothing more. I have tried everything from modifying my config file to setting WindowsAuthentication to true and even moving NTLM to the top, to going into IIS and giving everyone access to every possible function to the CSS directory, been at this for an hour and I'm simply lost, any ideas?
Edit: if it helps at all this is the erro i get when i navigate to one of the CSS files:
I found the issue and I feel incredibly stupid about it, as it turns out all of my css files had encryption set on, i simply had to turn it off: right-click
*.css file > Properties (General tab) > Advanced button > Encrypt contents to secure data checkbox.
Works like a dream. If anyone ever purchases a template form ThemeForest, be wary of that.

Is there any way to use Chrome resources in extensions

I'm developing a Chrome extension that has an options page. And I am willing to style this page same as Chrome options page is styled. I found that there is a file
chrome://resources/css/widgets.css
that holds this style (it is listed in "Developer Tools > Sources"). However, if try to load it in my page either directly from HTML
<link rel="stylesheet" href="chrome://resources/css/widgets.css" type="text/css">
or from CSS
#import url("chrome://resources/css/widgets.css");
then get this error printed in the console:
"Not allowed to load local resource: chrome://resources/css/widgets.css
It looks like I'm missing some permissions in my manifest.json, but did not find anything suitable on the developer's pages (notice it lists "chrome://favicon/", but that's it).
Anyone knows a solution?
P.S. Yes, I have copied this file into my extension's folder, and I got what I want, but the smart and proper way using this file (IMHO) is loading it directly from Chrome resources.
Short answer: No, you can't access chrome://resources... from an extension.
First, it's blocked on purpose, thus why you see "Not allowed to load local resource." Second, you really shouldn't rely on Chrome's resources, which can change in any version.

ASP.NET MVC does not catch styles when published

I have an ASP.NET MVC application that works fine when I run it on Visual Studio. But when I publish it, all the styles dont seem to work. Are there any general guidelines on why styles dont work for an MVC application when published because right now I have no clue on what is happenning??
Any ideas and suggestions are appreciated!
There are many reasons why your css styles might not show up.
Caching: Maybe your browser use a cached version of your css file(s). Check with fiddler or clear the browsers cache
Wrong relativ path to the css file(s): You should specify relative paths when including css files in your views (use Url.Content("~/...") for getting the right url). This is an issue when you use not the same path on your IIS and your IDE.
But the first check in any cas is to run fiddler and see
Is the browser requesting the right css file(s)
Is the server returning the file or a 404, 304, ... status code
It is possible that you have defined the styles in a new file and have not included the new css file in your project (in Visual Studio .net).
VS.Net does not publish those files which are not part of the project.
Get Firebug, inspect the element that should have the style applied and see what CSS is actually present.
Take a look at the CSS Panel and see the CSS files that are being linked (click the down arrow in the master.css as shown in the image below).

html code doesn't run in the browser, and only display the code

in order to find the server spec. i've created a file in the root dir in my website called spec.htm and entered this content as i was offered by another user:
<html>
<head>
<title></title>
</head>
<body>
#ServerInfo.GetHtml()
</body>
</html>
but i only get a copy of the code in my browser and it doesn't run it,
what the problem might be?
EDIT: i think that the problem is that i'm not using IIS.
is there a way to do so without using IIS?
thanks
Please see the following article
http://www.asp.net/webmatrix/tutorials/14-introduction-to-debugging
The ServerInfo helper is a diagnostic tool that gives you an overview of information about the web server environment that hosts your page. It also shows you HTTP request information that is sent when a browser requests the page. The ServerInfo helper displays the current user identity, the type of browser that made the request, and so on. This kind of information can help you troubleshoot common issues.
Create a new web page named ServerInfo.cshtml.
At the end of the page, just before the closing tag, add the following highlighted code.
#ServerInfo.GetHtml()
Note, it appears as though this is designed to run in IIS only and not on Linux / Apache servers.
Note, this is a RAZOR syntax so your system needs to be able to run Razor by installing the WebMatrix
#ServerInfo.GetHtml() is a Razor view engine syntax. Try saving your file as .cshtml or .vbhtml
The problem is that your webserver is not set up to serve HTML files through the ASP.NET interpreter. Change the extension to .aspx (i.e., use the same code, but call it spec.aspx).
Are you setting the Content-Type header correctly. If not set to text/html or similar, the browser or framework may set the content-type to text/plain which will not render the html at all.
You can check this in Firebug in the Net tab, expanding the response that is associated with the page you are serving, and looking in the Headers tab. If the Content-Type header is anything besides text/html or text/xhtml, then you need to find a way to make your web server set that header properly
let me guess its just showing up "#ServerInfo.GetHtml()" on a webpage. This does nothing if you put it simply in a body tag of a html page. If you are running IIS make sure you are saving as .aspx and not .html
See "yourhtmlsource.com/myfirstsite/myfirstpage.html"
I hope I am understanding the question and this helps. I found it on the web page given above.
When you double-click a file on your computer’s desktop, the computer knows what program to open the file in by checking the file’s “extension”. A txt file will open in a text editor.
You need to give your document a file extension of ”.html”, which will tell it to open the file in your web browser, such as Internet Explorer, Firefox or Safari.
Right now you should be editing your HTML page in a text editor, which normally saves files with the extension “.txt”. We want to make it save in “.html”. In your text editor click File → Save As…. If you use Microsoft Windows, there will be a box labelled “save as type”; change it to “all files .”. This means that you can save the data (in this case, some text) into any format. Now type in the name index.html for your file and click save. Ex: file.txt becomes file.html.

Resources