3

In Visual Studio 2012 i have created a new ASP.NET MVC 4 project and i did not edit anything. When i debug this project with IIS Express in Google Chrome the website just keeps loading. If i press F12 and view the "Network" tab, the Site.css just keeps having the "Pending" status and never loads. Internet Explorer 9 shows the same behaviour. The rest of the files (HTML en Javascript) seem to load without a problem. The website files are on my local system and i have given "everyone" full rights to the folders.

I have tried multiple things like create new projects and moving the folder outsite of my userprofile but the result stays the same. If i comment out the link to the Site.css file my website loads right away without any problems.

The log of IIS Express does not even show a GET request for the Site.css file.

#Software: Microsoft Internet Information Services 8.0
#Version: 1.0
#Date: 2013-06-18 08:59:13
#Fields: date time s-ip cs-method cs-uri-stem cs-uri-query s-port cs-username c-ip cs(User-Agent) cs(Referer) sc-status sc-substatus sc-win32-status time-taken
2013-06-18 08:59:13 ::1 GET / - 62073 - ::1 Mozilla/5.0+(Windows+NT+6.1;+WOW64)+AppleWebKit/537.36+(KHTML,+like+Gecko)+Chrome/27.0.1453.94+Safari/537.36 - 200 0 0 15154
2013-06-18 08:59:13 ::1 GET /Scripts/modernizr-2.6.2.js - 62073 - ::1 Mozilla/5.0+(Windows+NT+6.1;+WOW64)+AppleWebKit/537.36+(KHTML,+like+Gecko)+Chrome/27.0.1453.94+Safari/537.36 http://localhost:62073/ 200 0 0 42
2013-06-18 08:59:13 ::1 GET /Scripts/jquery-1.8.2.js - 62073 - ::1 Mozilla/5.0+(Windows+NT+6.1;+WOW64)+AppleWebKit/537.36+(KHTML,+like+Gecko)+Chrome/27.0.1453.94+Safari/537.36 http://localhost:62073/ 200 0 0 124

On request: Here is the source of the HTML page that IIS Express provides:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Home Page - My ASP.NET MVC Application</title>
    <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    <link href="/Content/Site.css" rel="stylesheet"/>

    <script src="/Scripts/modernizr-2.6.2.js"></script>

</head>
<body>
    <header>
        <div class="content-wrapper">
            <div class="float-left">
                <p class="site-title"><a href="/">your logo here</a></p>
            </div>
            <div class="float-right">
                <section id="login">
                        <ul>
    <li><a href="/Account/Register" id="registerLink">Register</a></li>
    <li><a href="/Account/Login" id="loginLink">Log in</a></li>
</ul>

                </section>
                <nav>
                    <ul id="menu">
                        <li><a href="/">Home</a></li>
                        <li><a href="/Home/About">About</a></li>
                        <li><a href="/Home/Contact">Contact</a></li>
                    </ul>
                </nav>
            </div>
        </div>
    </header>
    <div id="body">

<section class="featured">
    <div class="content-wrapper">
        <hgroup class="title">
            <h1>Home Page.</h1>
            <h2>Modify this template to jump-start your ASP.NET MVC application.</h2>
        </hgroup>
        <p>
            To learn more about ASP.NET MVC visit
            <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
            The page features <mark>videos, tutorials, and samples</mark> to help you get the most from ASP.NET MVC.
            If you have any questions about ASP.NET MVC visit
            <a href="http://forums.asp.net/1146.aspx/1?MVC" title="ASP.NET MVC Forum">our forums</a>.
        </p>
    </div>
</section>

        <section class="content-wrapper main-content clear-fix">

<h3>We suggest the following:</h3>
<ol class="round">
<li class="one">
    <h5>Getting Started</h5>
    ASP.NET MVC gives you a powerful, patterns-based way to build dynamic websites that
    enables a clean separation of concerns and that gives you full control over markup
    for enjoyable, agile development. ASP.NET MVC includes many features that enable
    fast, TDD-friendly development for creating sophisticated applications that use
    the latest web standards.
    <a href="http://go.microsoft.com/fwlink/?LinkId=245151">Learn more…</a>
</li>

<li class="two">
    <h5>Add NuGet packages and jump-start your coding</h5>
    NuGet makes it easy to install and update free libraries and tools.
    <a href="http://go.microsoft.com/fwlink/?LinkId=245153">Learn more…</a>
</li>

<li class="three">
    <h5>Find Web Hosting</h5>
    You can easily find a web hosting company that offers the right mix of features
    and price for your applications.
    <a href="http://go.microsoft.com/fwlink/?LinkId=245157">Learn more…</a>
</li>
</ol>

        </section>
    </div>
    <footer>
        <div class="content-wrapper">
            <div class="float-left">
                <p>&copy; 2013 - My ASP.NET MVC Application</p>
            </div>
        </div>
    </footer>

    <script src="/Scripts/jquery-1.8.2.js"></script>


</body>
</html>
4
  • Show the code that renders the CSS references and the rendered HTML itself. It might be that your bundling is screwing up. Commented Jun 18, 2013 at 9:55
  • Could you post the page source from the rendered page? And did you try hardcoding a reference to the stylesheet in your _Layout.cshtml? Commented Jun 18, 2013 at 9:56
  • I added the source of the page to the question. It shows nothing special as far as i see. I tried hardcoding the reference but that did'nt work. I even tried opening the css through the browser by pasting the link in the URL bar but that did not work either. (I tried this also with other css files like \Content\themes\base\jquery-ui.css ) Commented Jun 18, 2013 at 10:25
  • keep in mind, that on deploying most paths get f*cked up. i recommend using a virtual directory or the solution @JochemTheSchoolKid Commented Jun 18, 2013 at 10:42

4 Answers 4

2

The problem seems to be with caching. I had something similar going on and I appended a ?__v=1234 and it worked. For this content I now serve it with something like:

String.Format("{0}?_v={1}", Url.Content("~/Content/foo.css"), DateTime.Now.Ticks)
Sign up to request clarification or add additional context in comments.

1 Comment

Using a temporary querystring on the URL in the target browser can help force a re-download of cached CSS and Javascript files, especially on some versions of IE and some mobile browsers, like iPad Safari. I've found this to be helpful when doing frequent updates.
1

I am not sure if this make any difference, I am just a starting student but I use this:

<link href="@Url.Content("~/Content/style.css")" rel="stylesheet" type="text/css" />

1 Comment

Adding the type did not work either. But i think the problem is IIS Express as it is not even providing the requested CSS file as seen in the logs in my question.
1

try:

<link href="~/Content/Site.css" rel="stylesheet" type="text/css">

1 Comment

Tried it, but the result stays the same. Site.css keeps having the status "pending".
1

are you using chrome? try pressing ctrl+shift+del and delete the cache.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.