Forum Moderators: not2easy
The program almost works. What doesn't work is when a stylesheet is called for the first time the background that has content will change. For example, if there is content halfway down the page the background color will change for halfway down the page.
However, if a color is selected twice the full page will turn the selected color.
Why won't the screen completely fill the first time the color is selected?
Here is the script. I'm using switch/case to make the selection.
case "blue":
echo "<style media=\"screen\" type=\"text/css\">
@import blue.css;
</style>";
break;
Why not instad use <link rel="stylesheet" type="text/css" href="blue.css" media="screen">?
Hmmm. Changed the script to:
case "blue":
echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"blue.css\" media=\"screen\">";
break;
It works, but with the same results as the previous version.
BTW if quotes are used --echo "@import blue.css";-- it will print the text out on the screen. Placing quotes like this --echo @import "blue.css";-- generates an error.
case "blue":
echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"blue.css\">
<style type=\"text/css\">
@ import url(blue.css);
</style>";
break;
Where Meyers' script differed was that the first reference of blue.css was to another stylesheet. His original usage was to trick earlier versions of NS into ignoring CSS script that would cause it to choke. By changing both the href and url reference it works for my purposes. Don't ask me why it just does.
The switch/case calls to the other stylesheets using the below script works consistently.
Is this a CSS problem?
case "blue":
echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"blue.css\">
<style type=\"text/css\">
@ import url(blue.css);
</style>";
break;
Which browser your using
The exact HTML snippet it generates
(Oh, and make sure the generated page validates.)
I have gotten it to work using this code:
case "blue":
echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"blue.css\">
<style type=\"text/css\">
@import url(blue.css);
</style>";
break;
Despite using both the 'link' and 'style' code it does validate.
"No error or warning found
Congratulations!
This document validates as CSS!"
If either the 'link' or 'style' code are omitted the script will not work properly. The biggest problem being when the css stylesheet is called initially the background color will fill the page up to the point that there is content. For example, if there is content in only the top third of the page, then only the top third of the background will change color. That is until the any one of the colors is selected twice. Once any color has been selected twice all of the colors will behave correctly.
I've been told that the 'link' script should be in the <head> area, but clearly that is not the case because it does validate when placed in the 'case' instructions.
I don't understand why CSS malfunctions unless the style sheet is called twice. Why is it that I'm being told to place 'link' in the <head> section to be legal and yet it will validate?
Oh yes, I'm using IE6 with the latest service pack.
DrDoc caught the problem--my typing a typo.
When corrected '@ import' to '@import' and moved the 'link' script to the <head> and made all an 'alternate stylesheet' everything works fine.
I'm fairly new to this and appreciate everyone's help.
case "blue":
echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"blue.css\">
<style type=\"text/css\">
@import url(blue.css);
</style>";
break;
Or why not try:
case "blue":
$case = "blue";
break;//at end of loop, put this:echo '<link rel="stylesheet" type="text/css" href="'.$case.'.css">
<style type="text/css">
@import url('.$case.'.css);
</style>';
I've done 2 things there. Removed the need for escaping double quotes by using single ones for the echo. (Something I have only just learnt - see this thread [webmasterworld.com] for reasons why this is a good idea.) Then simply assigned the case to a variable. That way you don't have to have duplicated lines of code echoing the stylesheet link - it can be moved to the end of the script, after the loop.
@import filename.css
@import (filename.css)
@import 'filename.css'
@import ('filename.css') etc
@import 'foo.css'
@import "foo.css"
@import url(foo.css)
@import url('foo.css')
@import url("foo.css")
See CSS2 Section 6.3 The @import rule [w3.org]
Like I said, I didn't have the list handy. The list I saw listed every possible permutation then stated whether it was valid or not, then went on to say which browsers it worked in, and which it failed in.
Thank you for the link to CSS2 Section 6.3 The @import rule. It is something that I've been looking for and provided a wealth of information.
[edited by: SuzyUK at 11:09 am (utc) on Aug. 21, 2004]
[edit reason] fixed link [/edit]
Not enough brain cells to retain the information these days.....
