Email conversation
| From | Andrew Thomas Blake |
|---|
| To | Me |
|---|
| Subject | a PHP call within CSS? e.g. background-image: url(image-generator.php); |
|---|
| Date | 2 December 2006 21:56 |
|---|
Hello Mark
I've been referring to your site for many months now and consider it to be
the last word in web design expertise.
I need an expert to answer me this question please!
In your CSS tutorial (on the externalfiles page) you say "The url value can
use any valid file URL"
Does this mean *only files*, or can I use scripts too?
(I've tried this, and it looks like the answer is "no", but I don't want to
just leave it at that, I want to know why.)
I am programming in PHP, and have a script which takes image data (in jpg,
gif, or png format) from a database, and squirts it out to the server with
the correct Content-type header for the image, and it works fine.
That is, I can put <img src='image-generator.php'> in my html, and I will
see the image that the script generates.
However, I want to use the same technique in CSS.
I want to be able to write
#someid
{
background-image: url(image-generator.php);
}
in a CSS file and see the image generated by the script as the background
for the element with id of "someid".
It doesn't work.
(Note: all html, css and php files are in the same directory.)
Note: some of the other people I have asked this question of think that I'm
asking about generating CSS with PHP.
But that's not it. I already generate all the HTML, CSS and images in PHP,
but the problem I have is what to do when the CSS -- whether static or
generated by PHP -- gets to
background-image: url(.....
and I want to see an image that only exists inside a database.
Do you know if there is some kind of philosophy behind CSS that might have
caused its designers to decide to disallow script calls from within url()
specifiers?
Thanks for your help.
Andrew Thomas Blake
| From | Me |
|---|
| To | Andrew Thomas Blake |
|---|
| Subject | Re: a PHP call within CSS? e.g. background-image: url(image-generator.php); |
|---|
| Date | 3 December 2006 00:02 |
|---|
Andrew,
> background-image: url(image-generator.php);
>
> It doesn't work.
It really should work (CSS does not say that it is not allowed). I tried it
with my own pages and it worked there.
Some things to try:
1. make sure the PHP script sends the correct headers:
header('Content-Type: image/jpeg');
header('Content-Length: '.strlen($imagedata));
print $imagedata;
2. make sure you get the script path right - in CSS, the image reference is
relative to the stylesheet file, not the HTML page:
HTML page; /foo/bar.html
CSS file; /baz/main.css
PHP image script; /foo/image-generator.php
The CSS in that example must use this:
background-image: url(../foo/image-generator.php);
not this (since it will look for /baz/image-generator.php):
background-image: url(image-generator.php);
If it still fails, send me a URL with a demo of the failure, so I can try to
see what is going wrong.
Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/
| From | Andrew Thomas Blake |
|---|
| To | Me |
|---|
| Subject | Re: a PHP call within CSS? e.g. background-image: url(image-generator.php); |
|---|
| Date | 3 December 2006 00:13 |
|---|
Hi Mark
It isn't there! (I just noticed someone opened a demo session of the old
"havethatsite" from [URL])
[Ed. yeah, so I went looking ;) ]
-- The thing I'm working on now might turn into version 2 at some point.
You have very good news, thank you.
I hope I can figure it out from here, knowing it's some blunder that *I'm*
making.
Andrew
| From | Andrew Thomas Blake |
|---|
| To | Me |
|---|
| Subject | Re: a PHP call within CSS? e.g. background-image: url(image-generator.php); |
|---|
| Date | 3 December 2006 21:13 |
|---|
Hi Mark
Thanks again for your help, it made the difference.
Embarrassing as it is, I feel I owe it to you to admit what was finally the
problem.
(It took about an hour to track down, but once I'd had it confirmed that it
was a problem at my end, I knew I wouldn't be wasting my time looking for a
bug.)
The PHP code that writes the CSS "background-image" attribute had a space
between the "url" and the open-parenthesis.
It's quite remarkable that I shouldn't have come across this problem before,
but I hadn't. (I do quite a lot of programming in Javascript, C++, and now
PHP, and I *always* put a space between the function name and the
parenthesis that begins the list of arguments.)
I now see that the CSS2 specification states that the syntax is 'url('
followed by optional whitespace, etc.
I would have liked them to be more explicit about no space between the 'url'
and the '(', just as it would have helped to see it written in black and
white that scripts will work too. But never mind.
Anyway, sorry to have bothered you over it.
But since I'm bothering you anyway, I'd like to take the opportunity to
emphasise what a great help the "How To Create" website has been for me. The
tutorials are pitched just right, and having the solid information to back
up my stand against IE is fantastic. Thanks!
Andrew Blake