CSS rendering issue after logout_问答_开发者_运维开发者技术经验分享

I have one main masterpage and three that inherit from it; my site changes masterpages based on the state of the user (logged out, logged in without admin privileges, logged in with admin privileges) in order to change the side menu appropriately.

When I'm logged in, the master pages normaluser.master and admin.master work just fine.

When I'm logged out, loggedout.master fails to render any css from the stylesheet, turning my pretty side menu into a list of underlined blue links and removing all header styles.

MasterPage.master:

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<!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 id="Head1" runat="server">
    <asp:ContentPlaceHolder id="head" runat="server">
    </asp:ContentPlaceHolder>
    <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body style="background-color: rgb(231, 231, 255);height:100%;margin:0px;padding:0px">
    <form id="form1" runat="server">
    <div style="background-color:rgb(74, 60, 140);color: rgb(247, 247, 247);height:20%">
        <div style='width:7%;display:inline-block;border:none;padding:0px;padding-left:2px'>
            <img src="Images/globe2.png" style="height:100px;vertical-align:middle"/>
        </div>
        <div style='display:inline-block;vertical-align:middle;'>
            <span style='font-size:36pt;padding-left:10px;font-family:Century,inherit'> Welcome To MeetSmart: </span><span style="font-size:16pt;font-style:italic"> Your smarter meeting solution</span>
        </div>
    </div>
    <div style="height:80%">
        <div style='width:15%;height:100%;display:inline-block;text-align:center;margin-top:10px;padding:0px;'>
            <asp:ContentPlaceHolder id="Menu" runat="server">

            </asp:ContentPlaceHolder>

        </div>
        <div 开发者_StackOverflowstyle='display:inline-block;margin:0px;padding-left:10px;padding-top:20px;border:2px solid purple;width:75%;height:100%;vertical-align:top'>
            <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">

            </asp:ContentPlaceHolder>
        </div>
    </div>
    </form>
</body>
</html>

normaluser.master:

<%@ Master Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="normaluser.master.cs" Inherits="normaluser" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<title>
<asp:ContentPlaceHolder id="title" runat="server">
</asp:ContentPlaceHolder>
</title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="Menu" Runat="Server">
        <div class='menuItem'> <a href="Schedule.aspx" class='menuItem'>My Schedule </a></div>
        <div class='menuItem'> <a href="MyProfile.aspx" class='menuItem'>My Profile </a></div>
        <div class='menuItem'> <a href="DocManagerUser.aspx" class='menuItem'>Document Center </a></div>
        <div class='menuItem'> <a href="Directory.aspx" class='menuItem'>Directory</a></div>
        <div class='menuItem'> <a href="Logout.aspx" class='menuItem'>Log out </a></div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <asp:ContentPlaceHolder id="mainContent" runat="server">

    </asp:ContentPlaceHolder>
</asp:Content>

loggedout.master:

<%@ Master Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="LoggedOut.master.cs" Inherits="LoggedOut" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
    <link runat="server" href="StyleSheet.css" rel="stylesheet" type="text/css" />
    <title>

    <asp:ContentPlaceHolder id="title" runat="server">
    </asp:ContentPlaceHolder>
    </title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="Menu" Runat="Server">
    <div class='menuItem'><a href="Login.aspx" class='menuItem'>Log In </a><br /></div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<asp:ContentPlaceHolder id="mainContent" runat="server">
    </asp:ContentPlaceHolder>
</asp:Content>

With or without "runat=server", the stylesheet link in loggedout does nothing; adding that was one way I tried to solve it. All the master pages and the stylesheet are in the same folder.

Considering your descriptions, looks like your CSS is in a directory which is secured under authentication. In order to have the CSS and scripts to be available on Login and other un-authenticated pages, you would need to make them available beyond authentication.

To do this, you can add those CSS and scripts etc, to a directory (say Public folder on root) and use location element in web.config to provide access to everyone to these directoy. This has not compromise on your security as such.

<configuration>
   <location path="Public">
      <system.web>
         <authorization>
            <allow users="*"/>
         </authorization>
      </system.web>
   </location>
</configuration>