Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > DOCTYPE / background-image madness!

Reply
Thread Tools

DOCTYPE / background-image madness!

 
 
TC
Guest
Posts: n/a
 
      07-24-2006
Hi folks

I want to enhance my website to distinguish "external" hyperlinks from
"internal" ones.

With that aim, I've written the following two small files for testing
purposes:

C:\styles.css:

.extlink {
background: url(http://tc2.atspace.com/extlink.gif) no-repeat
right middle;
padding-right: 12px; }

C:\test.htm:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<LINK REL=StyleSheet HREF="styles.css" TYPE="text/css">
</HEAD>
<BODY>
<A class=extlink href=zzz>WHATEVER</A>
</BODY>
</HTML>

I want to open C:\test.htm directly from my hard disk, to see how the
background image looks, before I change my actual website.

Problems:

(1) IE6 only displays the background image if I remove the DOCTYPE
declaration. If I retain that declaration, it does not display that
image, even though it still obeys the other aspects of the 'extlink'
style. Adding or removing an IE6 "mark of the web" (MOTW) has no affect
on this, one way or the other.

(2) FireFox 1.5 does not display the image at all - with or without the
DOCTYPE declaration.

Questions:

(1) Why does the DOCTYPE stop IE6 displaying the image?

(2) Why doesn't FF display the image at all?

(3) What should I do to resolve this, to enable local testing of the
files on my hard disk?

I realize that it will probably all work fine, when I copy all of the
relevant files to my web host. But I want to know why it *doesn't* work
fine when I run them locally on my PC. Generally I like to test my
changes locally, before I copy them to my web host.

TIA,
TC (MVP MSAccess)
http://tc2.atspace.com

 
Reply With Quote
 
 
 
 
Els
Guest
Posts: n/a
 
      07-24-2006
TC wrote:

> .extlink {
> background: url(http://tc2.atspace.com/extlink.gif) no-repeat
> right middle;


Make that right center.

> padding-right: 12px; }
> <A class=extlink href=zzz>WHATEVER</A>


Make that <a class="extlink" href="zzz">WHATEVER</a>

> I want to open C:\test.htm directly from my hard disk, to see how the
> background image looks, before I change my actual website.
>
> Problems:
>
> (1) IE6 only displays the background image if I remove the DOCTYPE
> declaration. If I retain that declaration, it does not display that
> image, even though it still obeys the other aspects of the 'extlink'
> style.


Usually that means that you've done something wrong in the code, which
IE will "forgive" if you have it in Quirksmode, since in Quirksmode it
doesn't "have to" follow the W3C guidelines.

Add the doctype, then *validate your code*, and fix the errors. If
then still IE doesn't show your background, come asking and show an
online example of what it is that's not working.

> Adding or removing an IE6 "mark of the web" (MOTW) has no affect
> on this, one way or the other.


What *is* a mark of the web?

> (2) FireFox 1.5 does not display the image at all - with or without the
> DOCTYPE declaration.


Firefox always wants to follow the W3C recommendations

> Questions:
>
> (1) Why does the DOCTYPE stop IE6 displaying the image?


Probably cause your code wasn't good.

> (2) Why doesn't FF display the image at all?


See above.

> (3) What should I do to resolve this, to enable local testing of the
> files on my hard disk?


Make your code good.

> I realize that it will probably all work fine, when I copy all of the
> relevant files to my web host. But I want to know why it *doesn't* work
> fine when I run them locally on my PC. Generally I like to test my
> changes locally, before I copy them to my web host.


Good thinking.
However, if you use a file locally and have the href as
file:///C:/blabla, then it will work locally, but not after uploading.
To prevent mishaps like that, you could think of installing a
webserver locally as well. Apache is free

--
Els http://locusmeus.com/
 
Reply With Quote
 
 
 
 
TC
Guest
Posts: n/a
 
      07-24-2006

TC wrote:

> .extlink {
> background: url(http://tc2.atspace.com/extlink.gif) no-repeat


PS. ATSPACE disallows hotlinking to images on their server from outside
their server. So if you click the link above, it fails with an error.
But I've repeated the whole process using the following (freely
linkable) image: http://i.microsoft.com/h/en-us/i/msnlogo.gif The
result was identical.

TC

 
Reply With Quote
 
Els
Guest
Posts: n/a
 
      07-24-2006
TC wrote:

> TC wrote:
>
>> .extlink {
>> background: url(http://tc2.atspace.com/extlink.gif) no-repeat

>
> PS. ATSPACE disallows hotlinking to images on their server from outside
> their server. So if you click the link above, it fails with an error.


You're sure? I did click it, and saw a nice little external link
image. I think you mean that it will fail if there is a non-atspace
referer, which would be the case when calling it from a page, combined
with a browser that doesn't block the referer.

> But I've repeated the whole process using the following (freely
> linkable) image: http://i.microsoft.com/h/en-us/i/msnlogo.gif The
> result was identical.




--
Els http://locusmeus.com/
 
Reply With Quote
 
JP. Baker
Guest
Posts: n/a
 
      07-24-2006
In article <(E-Mail Removed) .com>,
TC <(E-Mail Removed)> wrote:
>C:\styles.css:
>
> .extlink {
> background: url(http://tc2.atspace.com/extlink.gif) no-repeat
>right middle;


right center;

> padding-right: 12px; }
>
>Questions:
>
>(1) Why does the DOCTYPE stop IE6 displaying the image?


Presumably it allows this bug in non-standards mode.

>(2) Why doesn't FF display the image at all?


Because it _should_ ignore the whole rule if there an error.

>(3) What should I do to resolve this, to enable local testing of the
>files on my hard disk?


Correct the CSS. In Firefox 1.5 the errors are shown in the Javascript
Console (Tools/ Javascript Console) - to be renamed Error Console in
Firefox 2 as it shows other errors.

John
--
John P Baker
 
Reply With Quote
 
TC
Guest
Posts: n/a
 
      07-24-2006

Els wrote:
> TC wrote:


> > Problems:
> >
> > (1) IE6 only displays the background image if I remove the DOCTYPE
> > declaration. If I retain that declaration, it does not display that
> > image, even though it still obeys the other aspects of the 'extlink'
> > style.

>
> Usually that means that you've done something wrong in the code, which
> IE will "forgive" if you have it in Quirksmode, since in Quirksmode it
> doesn't "have to" follow the W3C guidelines.
>
> Add the doctype, then *validate your code*, and fix the errors. If
> then still IE doesn't show your background, come asking and show an
> online example of what it is that's not working.


Yes, good idea to validate first. I'll try that now. But I suspect that
there is no point putting an example online - it will almost certainly
*work* online


> > Adding or removing an IE6 "mark of the web" (MOTW) has no affect
> > on this, one way or the other.

>
> What *is* a mark of the web?


IE executes local files (C:/blah.test) under the security restrictions
of the Local zone. In days gone by, the Local zone had *less*
restrictions than the Internet zone. So local files were *more capable*
than remote ones. Now days, the Local zone has *more* restrictions than
the Internet zone, so local files are (by default) *less* capable than
remote ones. This gves problems if you want to test your files locally
- they'll have *less* capablity than when you put them on your server!

The MOTW is a special HTML comment which, if included in an HTML file,
says to IE: "execute this file under the security restrictions of the
Internet zone, not the Local zone". This lets you test your files "as
if" they were actually on the web. Despite what many people seem to
think, the MOTW feature is not a security hole, of any descripton.

TC (MVP MSAccess)
http://tc2.atspace.com

 
Reply With Quote
 
Els
Guest
Posts: n/a
 
      07-24-2006
TC wrote:

> Yes, good idea to validate first. I'll try that now. But I suspect that
> there is no point putting an example online - it will almost certainly
> *work* online


I don't see why. Really, if the doctype is what makes the difference,
that proves it's not a misplaced image file or anything. So if it
works locally without doctype, and not with a doctype, the same will
be the case on the web.

>>> Adding or removing an IE6 "mark of the web" (MOTW) has no affect
>>> on this, one way or the other.

>>
>> What *is* a mark of the web?

>
> IE executes local files (C:/blah.test) under the security restrictions
> of the Local zone. In days gone by, the Local zone had *less*
> restrictions than the Internet zone. So local files were *more capable*
> than remote ones. Now days, the Local zone has *more* restrictions than
> the Internet zone, so local files are (by default) *less* capable than
> remote ones. This gves problems if you want to test your files locally
> - they'll have *less* capablity than when you put them on your server!
>
> The MOTW is a special HTML comment which, if included in an HTML file,
> says to IE: "execute this file under the security restrictions of the
> Internet zone, not the Local zone". This lets you test your files "as
> if" they were actually on the web. Despite what many people seem to
> think, the MOTW feature is not a security hole, of any descripton.


Never heard of it, and never had a problem with HTML files locally,
even if I open them as local files instead of serving them as
webpages. I suppose this only comes into play when using scripts and
stuff, not plain HTML and CSS.

--
Els http://locusmeus.com/
 
Reply With Quote
 
TC
Guest
Posts: n/a
 
      07-24-2006

TC wrote:
> Els wrote:
> > TC wrote:

>
> > > Problems:
> > >
> > > (1) IE6 only displays the background image if I remove the DOCTYPE
> > > declaration. If I retain that declaration, it does not display that
> > > image, even though it still obeys the other aspects of the 'extlink'
> > > style.

> >
> > Usually that means that you've done something wrong in the code, which
> > IE will "forgive" if you have it in Quirksmode, since in Quirksmode it
> > doesn't "have to" follow the W3C guidelines.
> >
> > Add the doctype, then *validate your code*, and fix the errors. If
> > then still IE doesn't show your background, come asking and show an
> > online example of what it is that's not working.

>
> Yes, good idea to validate first. I'll try that now. But I suspect that
> there is no point putting an example online - it will almost certainly
> *work* online


Ok, I just validated my file C:/test.htm at http://validator.w3.org/.
It objected (rather obscurely) to the missing TITLE element. I added
<TITLE>blah</TITLE> to the HEAD element, and now it validates as: "This
Page Is Valid HTML 4.01 Transitional!".

I re-checked what I said in my original post, and it is still the same.
The DOCTYPE element stops the background mage from rendering when I run
the HTML file from my hard disk

Any ideas why?

TIA,
TC (MVP MSAccess)
http://tc2.atspace.com

 
Reply With Quote
 
Els
Guest
Posts: n/a
 
      07-24-2006
TC wrote:

>> Yes, good idea to validate first. I'll try that now. But I suspect that
>> there is no point putting an example online - it will almost certainly
>> *work* online

>
> Ok, I just validated my file C:/test.htm at http://validator.w3.org/.
> It objected (rather obscurely) to the missing TITLE element. I added
> <TITLE>blah</TITLE> to the HEAD element, and now it validates as: "This
> Page Is Valid HTML 4.01 Transitional!".
>
> I re-checked what I said in my original post, and it is still the same.
> The DOCTYPE element stops the background mage from rendering when I run
> the HTML file from my hard disk
>
> Any ideas why?


Can you put the example online?

--
Els http://locusmeus.com/
accessible web design: http://locusoptimus.com/
 
Reply With Quote
 
TC
Guest
Posts: n/a
 
      07-24-2006

Els wrote:
> TC wrote:
>
> > Yes, good idea to validate first. I'll try that now. But I suspect that
> > there is no point putting an example online - it will almost certainly
> > *work* online

>
> I don't see why. Really, if the doctype is what makes the difference,
> that proves it's not a misplaced image file or anything. So if it
> works locally without doctype, and not with a doctype, the same will
> be the case on the web.


Ok. I could be wrong in that assumption. Now I will actually test it!
If it still goes wrong when run from the web, I'll post an online URL
here.


> > The MOTW is (snip)


> Never heard of it, and never had a problem with HTML files locally,
> even if I open them as local files instead of serving them as
> webpages. I suppose this only comes into play when using scripts and
> stuff, not plain HTML and CSS.


Yes, it's only relevant when IE thinks the page has "active content"
(eg. scripts). In theory, the MOTW should just suppress the prompt that
IE issues to ask the user if he wants to run that content. But in
practice, I've found some cases where including an MOTW (to suppress
that prompt), does *not* produce the same effect as excludng it &
replying "yes" to the prompt.

There's lots of usenet comment on "mark of the web" or MOTW.

Cheers,
TC (MVP MSAccess)
http://tc.atspace.com

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
CSS Newbie - CSS Works With Invalid DOCTYPE. Fails With Valid DOCTYPE. Larry Lindstrom HTML 19 06-12-2012 02:07 PM
Changing DOCTYPE in template Jake ASP .Net 0 08-17-2005 12:50 PM
DOCTYPE declarations not generated by ASP.NET Neil Zanella ASP .Net 3 01-04-2005 11:18 PM
Setting DocType in Asp.Net Kenneth Keeley ASP .Net 1 06-30-2004 01:59 PM
vs.net creates doctype wrong? Ian ASP .Net 2 06-21-2004 12:32 PM



Advertisments