CSS Link Not working

Discussion in 'Web Development & Web Hosting' started by Fergal1982, Nov 28, 2008.

  1. Fergal1982

    Fergal1982 Petabyte Poster

    4,196
    172
    211
    Nov 28, 2008 #1
    Remove Advertisement - Premium Membership
    Guys,

    I've been doing some work in converting one of our apps to ASP.Net, and have hit a slight problem.

    In our pages, we reference a stylesheet in the root of the website. Previously this has been referenced using relative paths (ie '../').

    The problem with this, is that we're using Server.Transfer from ASP.Net to move between pages (at least in some instances). When you use S.T, the new page thinks its in the same location as the old page.

    In order to get around this, I've been trying to amend the links on the page to use the site-root relative paths. I've tried both of the following, but neither seem to be working for me:

    Code:
    [SIZE=2][COLOR=#0000ff]<[/COLOR][/SIZE][SIZE=2][COLOR=#a31515]link[/COLOR][/SIZE][SIZE=2][COLOR=#ff0000]rel[/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]="stylesheet"[/COLOR][/SIZE][SIZE=2][COLOR=#ff0000]type[/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]="text/css"[/COLOR][/SIZE][SIZE=2][COLOR=#ff0000]href[/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]="/DotNetstyle.css"[/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]/>[/COLOR][/SIZE]
[SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]<[/COLOR][/SIZE][SIZE=2][COLOR=#a31515]link[/COLOR][/SIZE][SIZE=2][/SIZE][SIZE=2][COLOR=#ff0000]rel[/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]="stylesheet"[/COLOR][/SIZE][SIZE=2][/SIZE][SIZE=2][COLOR=#ff0000]type[/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]="text/css"[/COLOR][/SIZE][SIZE=2][/SIZE][SIZE=2][COLOR=#ff0000]href[/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]="~/DotNetstyle.css"[/COLOR][/SIZE][SIZE=2][/SIZE][SIZE=2][COLOR=#0000ff]/>
[/COLOR][/SIZE][/COLOR][/SIZE]
    Can anyone see what I'm doing wrong here? By all accounts this should be working.

    For clarity, the page I'm testing this on is also in the site root.
     
    Certifications: ITIL Foundation; MCTS: Visual Studio Team Foundation Server 2010, Administration
    WIP: None at present
  2. westernkings

    westernkings Gigabyte Poster

    1,432
    60
    107
    Nov 28, 2008 #2
    Remove Advertisement - Premium Membership
    Code:
    <link href="style.css" rel="stylesheet" type="text/css" />
    That's how the links should be.

    EDIT!!!!

    top of file code should be like this

    Code:
    <!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
    Obviously slight differences depending on file type.
     
    Certifications: MCITP:VA, MCITP:EA, MCDST, MCTS, MCITP:EST7, MCITP:SA, PRINCE2, ITILv3
  3. Fergal1982

    Fergal1982 Petabyte Poster

    4,196
    172
    211
    Nov 28, 2008 #3
    Thats how I have it, isnt it?

    Thats fine when the object is in the same level, but what about when you are trying to link to a page in another location on the site?

    The problem is, in this case, is that the page in question is an error page for the site. Let me see if I can explain the situation a bit better:

    Lets say that I set the stylesheet link on the error page to
    Code:
    <link rel="stylesheet" type="text/css" href="DotNetstyle.css" />
    If I navigate directly to that page as normal, the css will load fine.

    If you load up page /Work/DoSave.aspx (ie mysite.com/work/dosave.aspx), and that page does a Server.Transfer to the error page on the site root (ie mysite.com/error.aspx), a side effect of the S.T method is that, when the page is loading, it still thinks its in the calling pages location (ie /work). At this point, the href above is no longer valid and doesnt work.

    What I need to do, is set the link so that, when it is referencing the css document, it always starts from the site root, and goes from there. From what I've seen on the web, either ~/ or just / should accomplish this. But neither appears to be working.
     
    Certifications: ITIL Foundation; MCTS: Visual Studio Team Foundation Server 2010, Administration
    WIP: None at present
  4. westernkings

    westernkings Gigabyte Poster

    1,432
    60
    107
    Nov 28, 2008 #4
    You're missing the necessary spaces in the link

    Code:
    <link href="file:///C|/folder/folder/folder/folder/folder/css/style.css" rel="stylesheet" type="text/css" />
    That's the code I use to link to a Style sheet located on my desktop.

    Code:
    <link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
    That's the code I use for a CSS file located on folder in the root folder.

    If you copy your css link into Dreamweaver for example, the code becomes invalid because of lack of spaces.
     
    Certifications: MCITP:VA, MCITP:EA, MCDST, MCTS, MCITP:EST7, MCITP:SA, PRINCE2, ITILv3
  5. Fergal1982

    Fergal1982 Petabyte Poster

    4,196
    172
    211
    Nov 28, 2008 #5
    Thats just the CF management of my copy paste. the spaces are there, I assure you.
     
    Certifications: ITIL Foundation; MCTS: Visual Studio Team Foundation Server 2010, Administration
    WIP: None at present
  6. Fergal1982

    Fergal1982 Petabyte Poster

    4,196
    172
    211
    Nov 28, 2008 #6
    Ack! Never mind. I realised another problem with the relative paths in the way i was trying to do things: VS2005 doesn't use the css files during design time. Thats completely unacceptable for designing.

    Instead, I'll use another workaround for the problem.

    Cheers
     
    Certifications: ITIL Foundation; MCTS: Visual Studio Team Foundation Server 2010, Administration
    WIP: None at present
  7. ThomasMc

    ThomasMc Gigabyte Poster

    1,507
    49
    111
    Nov 28, 2008 #7
    I can't seem to reproduce that problem Fergal, do you have a mock solution that you could upload.
     
    Certifications: MCDST|FtOCC
    WIP: MCSA(70-270|70-290|70-291)
  8. westernkings

    westernkings Gigabyte Poster

    1,432
    60
    107
    Jan 2, 2009 #8
    can only assume it is the forward slash ( / ) infront of the CSS file name. /name.css.
     
    Certifications: MCITP:VA, MCITP:EA, MCDST, MCTS, MCITP:EST7, MCITP:SA, PRINCE2, ITILv3

Share This Page

Loading...
Remove Advertisement - Premium Membership
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Accept Learn More...