By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
434,778 Members | 1,318 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 434,778 IT Pros & Developers. It's quick & easy.

Style Sheet not getting applied to content page

P: n/a
I have a master page and a content page but the stylesheet isnt getting
applied like how it looks in visual studio design view.

The master page is defined like this:

<%@ Master Language="VB" CodeFile="MasterPage.master.vb"
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">
<title>Overbored.com</title>
<link rel="stylesheet" type="text/css" href="StyleSheet.css" />
</head>
<body>
<div id="wrapper">
<form id="Form1" runat="server">
<div id="header">
<span class="title">Overbored.com</span>
<span class="breadcrumb">Todo: Breadcrumb will go
here...</span>
</div>
<div id="content">
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
</div>
<div id="navigation">
<span class="title">Overbored.com</span>
<div id="Div1">
<asp:Menu ID="menu1" DataSourceID="SiteMapDataSource1"
runat="server"></asp:Menu>
<asp:SiteMapDataSource ID="SiteMapDataSource1"
ShowStartingNode="false" runat="server" />
</div>
</div>
</form>
</div>
<div id="footer">
<a href="http://www.overbored.com/Portal">http://www.overbored.com</a>
</div>
</body>
</html>

The content page is defines like this:

<%@ Page Language="VB" MasterPageFile="~/MasterPage.master"
AutoEventWireup="false" CodeFile="Login.aspx.vb" Inherits="Login" %>

<asp:Content ID="LoginContent" ContentPlaceHolderID="MainContent"
Runat="Server">

<div>
<asp:Login ID="Login1" runat="server" BackColor="#EFF3FB"
BorderColor="#B5C7DE" BorderPadding="4"
BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana"
Font-Size="0.8em"
ForeColor="#333333">
<TitleTextStyle BackColor="#507CD1" Font-Bold="True"
Font-Size="0.9em" ForeColor="White" />
<InstructionTextStyle Font-Italic="True" ForeColor="Black" />
<TextBoxStyle Font-Size="0.8em" />
<LoginButtonStyle BackColor="White" BorderColor="#507CD1"
BorderStyle="Solid" BorderWidth="1px"
Font-Names="Verdana" Font-Size="0.8em" ForeColor="#284E98" />
</asp:Login>
</div>
</asp:Content>

The style sheet is in the root folder and is called StyleSheet.css

/*
The below CSS file was built using samples + techniques described by
Rachel Andrew in her book:
The CSS Anthology: 101 Essential Tips, Tricks & Hacks
*/

/* Overall Page */

body {
margin: 0;
padding-bottom: 2em;
background-color: #FFFFFF;
color: #000000;
font-family: Arial, Helvetica, sans-serif;
border-top: 2px solid #3366CC;
}

/* Header Section */

#header {
border-top: 3px solid #3366CC;
border-bottom: 1px dotted #3366CC;
height: 3em;
}
#header .title {
font: 190% Arial, Helvetica, Georgia, "Times New Roman", Times, serif;
color: black;
background-color: transparent;
float: left;
margin-right: 2em;
margin-top: 0.3em;
margin-left: .8em;
}
#header .breadcrumb {
font: 90% Arial, Helvetica, Georgia, "Times New Roman", Times, serif;
color: #FFFFFF;
background-color: transparent;
float: right;
margin-right: 2em;
margin-top: 0.8em;
font-weight:bold;
}

#header a:link, a:visited {
color: #B51032;
}

/* Footer */

#footer {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1.5em;
background-color: #3366CC;
color: #3366CC;
border-top: #778899;
text-align: center;
}

#footer a:link, #footer a:visited {
padding: 0.8em 1em 0.5em 1em;
color: #FFFFFF;
background-color: transparent;
font-size: 80%;
}
/* Navigation */

#navigation {
width: 200px;
top: 5em;
left: 1em;
width: 13em;
position:absolute;
font-family: Arial, Helvetica, sans-serif;
font-size:90%;
}
#navigation ul {
list-style: none;
margin: 0;
padding: 0;
}
#navigation li {
border-bottom: 1px solid #ED9F9F;
}
#navigation li a:link, #navigation li a:visited {
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 12px solid #711515;
border-right: 1px solid #711515;
background-color: #B51032;
color: #FFFFFF;
text-decoration: none;
}
#navigation li a:hover {
background-color: #711515;
color: #FFFFFF;
}
#navigation ul ul {
margin-left: 12px;
}
#navigation ul ul li {
border-bottom: 1px solid #711515;
margin:0;
}
#navigation ul ul a:link, #navigation ul ul a:visited {
background-color: #ED9F9F;
color: #711515;
}
#navigation ul ul a:hover {
background-color: #711515;
color: #FFFFFF;
}

/* Main Content */

#content
{
margin-top:1em;
margin-left: 16em;
margin-right: 2em;
}
h1 {
font: 150% Arial, Helvetica, Georgia, "Times New Roman", Times, serif;
}
#content p {
font-size: 80%;
line-height: 1.6em;
}
In visual studio designer the content page looks right but when i run the
application the master page style is not applied. The content of the master
page is applied but not the style.

Please help!
Dec 10 '06 #1
Share this Question
Share on Google+
8 Replies


P: n/a
Also, I took the source of my page and put in a blank txt file and saved as
an html file. in that page the style is getting applied correctly. Is it
somethign to do with the permissions of the css file?
Dec 10 '06 #2

P: n/a
Ok, I looked at the output when rendered in IE and it works but does not work
in Firefox. Any ideas how to fix this?

"Amit" wrote:
Also, I took the source of my page and put in a blank txt file and saved as
an html file. in that page the style is getting applied correctly. Is it
somethign to do with the permissions of the css file?
Dec 10 '06 #3

P: n/a
The path to the stylesheet is hard-coded into your masterpage.

Get the "Live HTTP Headers" extension for Firefox and watch what requests it
makes to the server as it retrieves your ASPX pages, I'll bet you'll spot it
ask for the "StyleSheet.css" resource *from the same directory as the
document referencing it*. If the stylesheet is in the root of your website's
(i.e. right after the hostname) prepend "/" so it becomes "/stylesheet.css".

"Amit" <Am**@discussions.microsoft.comwrote in message
news:C8**********************************@microsof t.com...
Ok, I looked at the output when rendered in IE and it works but does not
work
in Firefox. Any ideas how to fix this?

"Amit" wrote:
>Also, I took the source of my page and put in a blank txt file and saved
as
an html file. in that page the style is getting applied correctly. Is
it
somethign to do with the permissions of the css file?

Dec 10 '06 #4

P: n/a
"Amit" <Am**@discussions.microsoft.comwrote in message
news:50**********************************@microsof t.com...
<link rel="stylesheet" type="text/css" href="StyleSheet.css" />
Does your website have no folders, then...? Is everything in the root...?
Dec 10 '06 #5

P: n/a
i have 2 folders set up. The stylesheet is at the root of the site. I tried
prepending a "/" so it becomes /stylesheet.css but that did not work.

Amit

"Mark Rae" wrote:
"Amit" <Am**@discussions.microsoft.comwrote in message
news:50**********************************@microsof t.com...
<link rel="stylesheet" type="text/css" href="StyleSheet.css" />

Does your website have no folders, then...? Is everything in the root...?
Dec 10 '06 #6

P: n/a
"Amit" <Am**@discussions.microsoft.comwrote in message
news:31**********************************@microsof t.com...
>i have 2 folders set up. The stylesheet is at the root of the site. I
tried
prepending a "/" so it becomes /stylesheet.css but that did not work.
That's hardly surprising...

Try this:

<link rel="stylesheet" type="text/css" href="~/StyleSheet.css" />
Dec 10 '06 #7

P: n/a
That did not work.

My masterpage now looks like this
<%@ Master Language="VB" CodeFile="MasterPage.master.vb"
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">
<title>Overbored.com</title>
<link rel="stylesheet" type="text/css" href="~/Styles.css" />
</head>

I installed Live HTTP headers and this is my output.
http://localhost/Overbored/Softball/...ayerStats.aspx

GET
/Overbored/Softball/Login.aspx?ReturnUrl=%2fOverbored%2fSoftball%2fPla yerStats.aspx HTTP/1.1
Host: localhost
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.8)
Gecko/20061025 Firefox/1.5.0.8
Accept:
text/xml,application/xml,application/xhtml+xml,text/html;q=0.9,text/plain;q=0.8,image/png,*/*;q=0.5
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Cookie:
..ASPXANONYMOUS=LkfYgoBPxwEkAAAAZjllZTE5MzgtNjE3NS 00YjcwLWI4OTMtYmZkNzdlOTVmZTRm0; ASP.NET_SessionId=oxousfnyrulg31f0yjyrjj2y
Cache-Control: max-age=0

HTTP/1.x 200 OK
Server: Microsoft-IIS/5.1
Date: Sun, 10 Dec 2006 23:31:29 GMT
X-Powered-By: ASP.NET
X-AspNet-Version: 2.0.50727
Cache-Control: private
Content-Type: text/html; charset=utf-8
Content-Length: 8099
----------------------------------------------------------
http://localhost/Overbored/Softball/Styles.css

GET /Overbored/Softball/Styles.css HTTP/1.1
Host: localhost
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.8)
Gecko/20061025 Firefox/1.5.0.8
Accept: text/css,*/*;q=0.1
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Referer:
http://localhost/Overbored/Softball/...ayerStats.aspx
Cookie:
..ASPXANONYMOUS=LkfYgoBPxwEkAAAAZjllZTE5MzgtNjE3NS 00YjcwLWI4OTMtYmZkNzdlOTVmZTRm0; ASP.NET_SessionId=oxousfnyrulg31f0yjyrjj2y
Cache-Control: max-age=0

HTTP/1.x 401 Access Denied
Server: Microsoft-IIS/5.1
Date: Sun, 10 Dec 2006 23:31:29 GMT
WWW-Authenticate: Negotiate
WWW-Authenticate: NTLM
Connection: close
Content-Length: 4046
Content-Type: text/html

"Mark Rae" wrote:
"Amit" <Am**@discussions.microsoft.comwrote in message
news:31**********************************@microsof t.com...
i have 2 folders set up. The stylesheet is at the root of the site. I
tried
prepending a "/" so it becomes /stylesheet.css but that did not work.

That's hardly surprising...

Try this:

<link rel="stylesheet" type="text/css" href="~/StyleSheet.css" />
Dec 10 '06 #8

P: n/a
Ok, thanks guys I think I got it working now. I think it was a combination
of a permission error and a path error for the stylesheet. Thanks for the
tip on the Live HTTP headers...that enabled me to catch the permission error
and thanks for the stylesheet path tip. Looks likes it working.

Amit
Dec 10 '06 #9

This discussion thread is closed

Replies have been disabled for this discussion.