I have this style sheet information on a page I have:
a:link, a:visited{
color: #FF0000;
text-decoration:none;
}
a:hover, a:active{
text-decoration:underline;
}
ul li a:link, a:visited{
color: #0000FF;
text-decoration:none;
}
ul li a:hover, a:active{
text-decoration:underline;
}
div a:link, a:visited{
color: #0000FF;
text-decoration:none;
}
div a:hover, a:active{
text-decoration:underline;
}
It works correctly in firefox, but in IE all the links are blue and wont underline when hovered over.Never mind. For some reason, when I would open the html document locally, it wouldn't display the CSS properly...but when I uploaded it and viewed it online, it worked the way it should.
I'm not sure why it did that...there are issues with some browsers that will not correctly load link styles off a style sheet. if you include it in a header it always seems to fix the problem.
the problem is that part of the great part about using a stylesheet is that it allows you to amend one file rather than many. so, what I have been doing lately is something of this sort:
<? php require "style.php"; ?>
this goes in between your head tags. then your style.php file would be something of this sort:
<style type="text/css">
styles go here
what i do, for orgazational reasons (I tend to have many class and id tags, as well as many primary tags like links, etc) is put all my a,body,hr tags into style.php to get imbedded onto each page, and then leave all my classes and ids in a style.css file which I link to in the style.php file.
Try this. It seems to fix that problem you are talking about.Ok I figured out what went wrong with this code. Notice how I'm defining 2 things on every line. On the lines for the <div> and <ul><li> tags I made a mistake.
Instead of "ul li a:link, a:visited" it should be "ul li a:link, ul li a:visited"
The same goes for all the other lines. For some reason Firefox will display the styles corectly if you do it the way I had it first. IE on the other hand reads it as just "a:visited" if you don't put the other tags in front of it.The order that you specify psuedo-classes also matters. Generally, this order works best:
a:link
a:visited
a:focus
a:active
a:hover
In your situation:
a:link, a:visited{
color: #FF0000;
text-decoration:none;
}
Set the styles for a:visited, and
ul li a:link, a:visited{
color: #0000FF;
text-decoration:none;
}
Reset the same thing. Firefox was right. IE was wrong. You'll run into that a lot the more you get into CSS design
Originally posted by Shmohel
there are issues with some browsers that will not correctly load link styles off a style sheet. if you include it in a header it always seems to fix the problem.
the problem is that part of the great part about using a stylesheet is that it allows you to amend one file rather than many. so, what I have been doing lately is something of this sort:
<? php require "style.php"; ?>
this goes in between your head tags. then your style.php file would be something of this sort:
<style type="text/css">
styles go here
the problem w/ that is u dont get to take advantage of one advantage external css files gives you. When you use the external css file it gets cached. This allows for all the pages to load faster. Just something to also think about. And I havent had any problems w/ using an external file in any case as you mentioned Shmohel.I put most of my stuff into an external file, but I had issues with link s being loaded correctly. I cannot remember which browser it was on, nor where I read the article that suggested doing it. i wish i could find it.I've never had problems with style sheets being loaded properly, save for three instances:
1) Internet Explorer 5.x Mac: Mostly when I edit the CSS and want to refresh. IE5-Mac has all sorts of caching quirks. You've got to dump the cache each time and set "Check for newer versions of pages" to "Every Time" in the Advanced preferences. Or set that preference mentioned in the previous sentence and hit the Apple + F11 keys about three or four times.
2) Internet Explorer 5.01 PC: It ignores print style sheets imported via the <link> tag, but if those style sheets @import additional style sheets, IE 5.01-PC will display those @import'ed print style sheets as screen style sheets.
3) The server is extremely busy and sends the CSS files slowly: IE has the most problems, but no browser does a good job of formatting a page when only part of the style information has been Download ed. Don't host your site on a slow server (Freewebs and Geocities is out of the question).
Originally posted by pawky
the problem w/ that is u dont get to take advantage of one advantage external css files gives you. When you use the external css file it gets cached.
Unless the CSS file gets sent with a no-cache header in the file itself, the browser will still cache it. You can even feel free to use a PHP file as a CSS file (Use PHP to write CSS). The PHP file the server sends will not tell the browser to not cache the file, so the browser will. Again. Browsers cache anything and everything unless you tell them not t
riginally posted by toicontien
Unless the CSS file gets sent with a no-cache header in the file itself, the browser will still cache it. You can even feel free to use a PHP file as a CSS file (Use PHP to write CSS). The PHP file the server sends will not tell the browser to not cache the file, so the browser will. Again. Browsers cache anything and everything unless you tell them not to.
yes, but having it internally it has to cache it w/ every page the css is on. externally it only needs to cache it once. That is a big difference over many pagesOriginally posted by pawky
yes, but having it internally it has to cache it w/ every page the css is on. externally it only needs to cache it once. That is a big difference over many pages
The CSS is external, Shmohel is just including it onto the page with PHP rather than the LINK tag.
a:link, a:visited{
color: #FF0000;
text-decoration:none;
}
a:hover, a:active{
text-decoration:underline;
}
ul li a:link, a:visited{
color: #0000FF;
text-decoration:none;
}
ul li a:hover, a:active{
text-decoration:underline;
}
div a:link, a:visited{
color: #0000FF;
text-decoration:none;
}
div a:hover, a:active{
text-decoration:underline;
}
It works correctly in firefox, but in IE all the links are blue and wont underline when hovered over.Never mind. For some reason, when I would open the html document locally, it wouldn't display the CSS properly...but when I uploaded it and viewed it online, it worked the way it should.
I'm not sure why it did that...there are issues with some browsers that will not correctly load link styles off a style sheet. if you include it in a header it always seems to fix the problem.
the problem is that part of the great part about using a stylesheet is that it allows you to amend one file rather than many. so, what I have been doing lately is something of this sort:
<? php require "style.php"; ?>
this goes in between your head tags. then your style.php file would be something of this sort:
<style type="text/css">
styles go here
what i do, for orgazational reasons (I tend to have many class and id tags, as well as many primary tags like links, etc) is put all my a,body,hr tags into style.php to get imbedded onto each page, and then leave all my classes and ids in a style.css file which I link to in the style.php file.
Try this. It seems to fix that problem you are talking about.Ok I figured out what went wrong with this code. Notice how I'm defining 2 things on every line. On the lines for the <div> and <ul><li> tags I made a mistake.
Instead of "ul li a:link, a:visited" it should be "ul li a:link, ul li a:visited"
The same goes for all the other lines. For some reason Firefox will display the styles corectly if you do it the way I had it first. IE on the other hand reads it as just "a:visited" if you don't put the other tags in front of it.The order that you specify psuedo-classes also matters. Generally, this order works best:
a:link
a:visited
a:focus
a:active
a:hover
In your situation:
a:link, a:visited{
color: #FF0000;
text-decoration:none;
}
Set the styles for a:visited, and
ul li a:link, a:visited{
color: #0000FF;
text-decoration:none;
}
Reset the same thing. Firefox was right. IE was wrong. You'll run into that a lot the more you get into CSS design
Originally posted by Shmohel there are issues with some browsers that will not correctly load link styles off a style sheet. if you include it in a header it always seems to fix the problem.
the problem is that part of the great part about using a stylesheet is that it allows you to amend one file rather than many. so, what I have been doing lately is something of this sort:
<? php require "style.php"; ?>
this goes in between your head tags. then your style.php file would be something of this sort:
<style type="text/css">
styles go here
the problem w/ that is u dont get to take advantage of one advantage external css files gives you. When you use the external css file it gets cached. This allows for all the pages to load faster. Just something to also think about. And I havent had any problems w/ using an external file in any case as you mentioned Shmohel.I put most of my stuff into an external file, but I had issues with link s being loaded correctly. I cannot remember which browser it was on, nor where I read the article that suggested doing it. i wish i could find it.I've never had problems with style sheets being loaded properly, save for three instances:
1) Internet Explorer 5.x Mac: Mostly when I edit the CSS and want to refresh. IE5-Mac has all sorts of caching quirks. You've got to dump the cache each time and set "Check for newer versions of pages" to "Every Time" in the Advanced preferences. Or set that preference mentioned in the previous sentence and hit the Apple + F11 keys about three or four times.
2) Internet Explorer 5.01 PC: It ignores print style sheets imported via the <link> tag, but if those style sheets @import additional style sheets, IE 5.01-PC will display those @import'ed print style sheets as screen style sheets.
3) The server is extremely busy and sends the CSS files slowly: IE has the most problems, but no browser does a good job of formatting a page when only part of the style information has been Download ed. Don't host your site on a slow server (Freewebs and Geocities is out of the question).
Originally posted by pawky
the problem w/ that is u dont get to take advantage of one advantage external css files gives you. When you use the external css file it gets cached.
Unless the CSS file gets sent with a no-cache header in the file itself, the browser will still cache it. You can even feel free to use a PHP file as a CSS file (Use PHP to write CSS). The PHP file the server sends will not tell the browser to not cache the file, so the browser will. Again. Browsers cache anything and everything unless you tell them not t
riginally posted by toicontien Unless the CSS file gets sent with a no-cache header in the file itself, the browser will still cache it. You can even feel free to use a PHP file as a CSS file (Use PHP to write CSS). The PHP file the server sends will not tell the browser to not cache the file, so the browser will. Again. Browsers cache anything and everything unless you tell them not to.
yes, but having it internally it has to cache it w/ every page the css is on. externally it only needs to cache it once. That is a big difference over many pages
Originally posted by pawky yes, but having it internally it has to cache it w/ every page the css is on. externally it only needs to cache it once. That is a big difference over many pages
The CSS is external, Shmohel is just including it onto the page with PHP rather than the LINK tag.