CSS in an external file not being applied

Question

I've read some similar issues here, but no answer they provided could help me.

I have a small asp.net page for study porpuses:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" 

Inherits="Site.Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="Stylesheet" type="text/css" href="/css/Landing.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div id="loginHeader" class="aaa">
        <div>
            <asp:TextBox ID="txtUsername" runat="server"/>
            <asp:TextBox ID="txtPassword" runat="server"/>
            <asp:Button ID="Button1" runat="server" Text="Login" OnClick="btnLogin_Click" />
            <asp:Button ID="Button2" runat="server" Text="Register" OnClick="btnRegister_Click" />
            <br />
            <asp:Label ID="Label1" runat="server" Text="Password not valid" Visible="False"/>
        </div>
    </div>
    </form>
</body>
</html>

As you can see, the css/landing CSS file is being added. Here is this css file:

#loginHeader 
{
display:block;
background-color:Blue;
}

.aaa
{
    display:block;
    background-color:Red;
}

If I open the page, no style is applied. Firebug shows that the css is being downloaded. If I move the css markup to the page, inside a tag, it works, if I change back to the css file, it stops working.

Do you see any reason for this behavior?

Thanks, Oscar

JSBach · Accepted Answer · 2012-02-04 14:31:24Z

1

I Just found it out: there was an error on my config file, which defined that the user should be logged in to access the css files... solved, thanks :)

answered Feb 4, 2012 at 14:31

JSBach

4,7678 gold badges56 silver badges101 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

IrishChieftain Over a year ago

Drag the CSS file from Solution Explorer into the head tag in code view ;-)

JSBach Over a year ago

Just did it. The problem was that the user had no permission to access the css folder ;)

Vikas · Accepted Answer · 2012-02-04 14:32:40Z

0

You have written the link tag this way.

<link rel="Stylesheet" type="text/css" href="/css/Landing.css" />

Make it

<link rel="Stylesheet" type="text/css" href="css/Landing.css" />

This will instruct the browser to look for the "Landing.css" file inside the css directory.

answered Feb 4, 2012 at 14:32

Vikas

3543 silver badges9 bronze badges

1 Comment

Oybek Over a year ago

Well this is a different thing. Path without a leading slash means relative path. If you are currently in, say, foo.bar/Products/Default.aspx then it will look for Landing.css in the directory foo.bar/Products/css/Landing.css. If there is a leading slash it means an absolute path and will follow foo.bar/css/Landing.css no matter what is the current location. The latter, i.e. with a leading slash is much more preferable.

Collectives™ on Stack Overflow

CSS in an external file not being applied

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related