UnexplainedWays
asked on
CSS and base href
I have a dynamic base href depending on if my page is run from localhost or my server.
Reason why? Here > http:Q_21858289.html
When i order these tages like this;
<base href=>
<link href=type="text/css">
<script src=></script>
they work when the page is the base root, however when the page is put into a sub folder, the javascript works but not the css file.
I can solve it by re-ordering:
<link href=type="text/css">
<base href=>
<script src=></script>
However this seems quite odd. I dont get why it is doing this, i thought the whole point of the base href was to tell the css file where to look.
My code changes the base href in the pageload. If it's my server, it adds http://myserver.com/ and if it's on the localhost it changes it to http://localhost/appname/.
I've tried a few things, like ../NAME.css and /NAME.css
I am using <link href="NAME.css" rel="stylesheet" type="text/css" />
Any ideas? Thanks.
(And if i haven't made myself clear, please ask more questions and i'll try to explain further)
Reason why? Here > http:Q_21858289.html
When i order these tages like this;
<base href=>
<link href=type="text/css">
<script src=></script>
they work when the page is the base root, however when the page is put into a sub folder, the javascript works but not the css file.
I can solve it by re-ordering:
<link href=type="text/css">
<base href=>
<script src=></script>
However this seems quite odd. I dont get why it is doing this, i thought the whole point of the base href was to tell the css file where to look.
My code changes the base href in the pageload. If it's my server, it adds http://myserver.com/ and if it's on the localhost it changes it to http://localhost/appname/.
I've tried a few things, like ../NAME.css and /NAME.css
I am using <link href="NAME.css" rel="stylesheet" type="text/css" />
Any ideas? Thanks.
(And if i haven't made myself clear, please ask more questions and i'll try to explain further)
ASKER
This is getting really werid, i've even given the full path to the css file which is valid. When i view source with a FF extention, it finds the file and embeds its in the source, and it found it.
Let me set this up and see what I get.
I would suggest trying to put it in a special folder, and only put the HTML files in the root folder:
index.html -> root/index.html
css.css -> root/css/css.css
and then <link href="css.css" rel="stylesheet" type="text/css">
index.html -> root/index.html
css.css -> root/css/css.css
and then <link href="css.css" rel="stylesheet" type="text/css">
ASKER
It's actually asp.net with a masterpage. It works in the root folder, but as soon as i put it into a css folder (or any folder) it wont work.
ASKER
Turns out it's to do with the css and the images it links to (background's). They don't follow the base href.
Is the CSS file in a specific position in relation to the page or to the master page? (It needs to be in relation to the page. The location of the master page will have no meaning because it's contents will simply be rendered into the page using it.)
ASKER
I have a base href for the location of all images and include files (css & js). That seems to work, but the images inside the url (background-image:) dont seem to use the base href. This was all thre images will work with the masterpage and the includes, but the contents of the css is whats causing the problem.
ASKER
Back to square 1 lol, now i can't get the css file to be accessed from a file in a sub folder.
I have a base href to www.mysite.com and then the foldername/filename.css for the css 'link', however, it seems to be trying to find foldername/foldername/file
The only way i can get it to work is to directly link it to www.mysite.com/foldername/filename.css. I am unable to do this because of the way this site is developed (in another Q so i wont go into that).
Here is what i have tried:
a <link href="filename.css" rel="stylesheet" type="text/css" />
b <link href="foldername/filename.
c <link href="/foldername/filename
d <link href="../foldername/filena
When run in the root folder they give these results
a = foldername/filename.css
b = foldername/foldername/file
c = /foldername/filename.css
d = foldername/filename.css
When run from a subfolder they give these results
a = ../foldername/filename.css
b = ../foldername/foldername/f
c = /foldername/filename.css
d = ../foldername/filename.css
When run from the root folder
a - works
b - dosn't
c - dosn't
d - works
When run from a sub folder
None work.
I have a base href to www.mysite.com and then the foldername/filename.css for the css 'link', however, it seems to be trying to find foldername/foldername/file
The only way i can get it to work is to directly link it to www.mysite.com/foldername/filename.css. I am unable to do this because of the way this site is developed (in another Q so i wont go into that).
Here is what i have tried:
a <link href="filename.css" rel="stylesheet" type="text/css" />
b <link href="foldername/filename.
c <link href="/foldername/filename
d <link href="../foldername/filena
When run in the root folder they give these results
a = foldername/filename.css
b = foldername/foldername/file
c = /foldername/filename.css
d = foldername/filename.css
When run from a subfolder they give these results
a = ../foldername/filename.css
b = ../foldername/foldername/f
c = /foldername/filename.css
d = ../foldername/filename.css
When run from the root folder
a - works
b - dosn't
c - dosn't
d - works
When run from a sub folder
None work.
Where, specifically, are your page and master page files in this directory structure? When you say "when run in the root folder", do you mean that the page is in the root folder, or the master page, or...?
ASKER
ok, here's the file system.
<root>
-Page1.aspx
[folderA]
-Masterpage
-css file
-js file
[folderB]
-Page2.aspx
When i talk about running from the root foler, i am talking about Page1.aspx, when i say a sub-folder, i mean Page2.aspx. FolderA is to keep all the masterpage files together (css,js,img's etc)
<root>
-Page1.aspx
[folderA]
-Masterpage
-css file
-js file
[folderB]
-Page2.aspx
When i talk about running from the root foler, i am talking about Page1.aspx, when i say a sub-folder, i mean Page2.aspx. FolderA is to keep all the masterpage files together (css,js,img's etc)
Got it. That's much clearer. :-)
Question:
Does your page or master page set runat="server" in either of the <link> or <head> elements?
Question:
Does your page or master page set runat="server" in either of the <link> or <head> elements?
"When run in the root folder they give these results"
"When run from a subfolder they give these results"
What does this mean? Give these results for what? Is this the URL that appears in the "view source" HTML link element? Or...?
"When run from a subfolder they give these results"
What does this mean? Give these results for what? Is this the URL that appears in the "view source" HTML link element? Or...?
ASKER
The view source, yes. It shows me what the browser "see's" then
ASKER
"Does your page or master page set runat="server" in either of the <link> or <head> elements?"
Only in the <base href> thats because it's dynamically changed in the page load. The links to the script/style is the same no matter what the base href is.
Only in the <base href> thats because it's dynamically changed in the page load. The links to the script/style is the same no matter what the base href is.
Very weird. If link and head elements are not runat="server", then you shouldn't be getting different URLs in the link tags in different browsers (which one of your comments above suggested you were seeing).
Very curious. If I have time, I may experiment a bit and see if I can recreate the odd behaviors you describe...
Very curious. If I have time, I may experiment a bit and see if I can recreate the odd behaviors you describe...
ASKER
Thanks, I have a quick hack that get's the file working.
I make the style sheet runat=server, then i make the href/src what it's meant to, then in the page load i say
link.src = base+ link.src.
Automatically makes it the full path and that seems to work. However, this line must be done per style sheet and that's not a good solution. (but it works)
I make the style sheet runat=server, then i make the href/src what it's meant to, then in the page load i say
link.src = base+ link.src.
Automatically makes it the full path and that seems to work. However, this line must be done per style sheet and that's not a good solution. (but it works)
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks for the help.
ASKER
When i say "it works", it only works when the css file is in the base root. When i put it into a folder, it can't find it at all. When i view the source of IE, it puts it as "FOLDER/FILE.css" and when i look in FF, it changes it to "../FOLDER/FILE.css".
Weird.
I have a feeling that they will be linked