Browser check needed please!

[Mark Tranchant]

A new project:

http://step-by-step.org.uk/

Don't worry about the links yet, the content hasn't been written. I'm
just interested in the introduction screen, which is my first attempt at
an absolutely-positioned layout.

I'd like to know whether this works well in all browsers. It *should*
look like this in a modern, standards-supporting browser:

http://tranchant.plus.com/tmp/scr (scaled down)

That layout should work in IE5+ including IE5/Mac and all Gecko, at
least. Ancient browsers should get a text alternative.

1) Could an IE5/Mac user please confirm that the crayons display
correctly, on a transparent background with the shadow darkening the
white and two greys in their background?

2) Opera, Konqueror, Safari users (and anyone else I've missed): please
confirm you get either the layout I intended or the plain text
alternative. I don't want any ugly boxes anywhere.

3) Any suggestions or comments?

Thanks!

--
Mark.
http://tranchant.plus.com/

[Els]

Mark Tranchant wrote:

A new project:

http://step-by-step.org.uk/

Don't worry about the links yet, the content hasn't been
written. I'm just interested in the introduction screen,
which is my first attempt at an absolutely-positioned
layout.
Just this paragraph made me go "oh no!", but then I clicked
the link. Very nice!
I'd like to know whether this works well in all browsers.
It *should* look like this in a modern,
standards-supporting browser:

http://tranchant.plus.com/tmp/scr (scaled down)
Only if the window is large enough ;-)
In any Gecko:
http://locusmeus.com/html-css/pageslipping.html
That layout should work in IE5+ including IE5/Mac and all
Gecko, at least. Ancient browsers should get a text
alternative.
In Netscape 4: text, with the crayons image below the menu.
Degraded nicely. I know you only asked for that first page,
but In NN4.79, the location and about pages don't do what you
want, as the menu doesn't go all the way to the right, it
covers the the title and part of the text.

IE3 doesn't show the crayons :-P
1) Could an IE5/Mac user please confirm that the crayons
display correctly, on a transparent background with the
shadow darkening the white and two greys in their
background?
IE5.01 and 5.5 on WinXP: no crayons, no dotted underline of
the menu items, not centered.
http://locusmeus.com/html-css/centeringpage.html
2) Opera, Konqueror, Safari users (and anyone else I've
missed): please confirm you get either the layout I
intended or the plain text alternative. I don't want any
ugly boxes anywhere.
Opera 6.06 and 7.51 show it correctly.
3) Any suggestions or comments?

I like it :-)

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Something Happens - Parachute

[la_haine]

Mark Tranchant <ma**@tranchant.plus.com> wrote in news:Z6rLc.4681$Fc7.867711
@stones.force9.net:

2) Opera, Konqueror, Safari users (and anyone else I've missed): please
confirm you get either the layout I intended or the plain text
alternative. I don't want any ugly boxes anywhere.

Just checked in Opera 7.52 for Windows - it looks just like you wanted it to
:)

--
Time flies like an arrow; fruit flies like a banana.

[Mark Tranchant]

Els wrote:

Mark Tranchant wrote:

http://step-by-step.org.uk/

Don't worry about the links yet, the content hasn't been
written. I'm just interested in the introduction screen,
which is my first attempt at an absolutely-positioned
layout.

Just this paragraph made me go "oh no!", but then I clicked
the link. Very nice!

Thanks. I do listen to you guys, you know!
http://locusmeus.com/html-css/pageslipping.html
Right. I'll look into that.
IE5.01 and 5.5 on WinXP: no crayons,
Gak! That's annoying. Any ideas why? The crayon <div> contains the
crayon image as an <img> for IE5/Mac only, and has it set as a
background for others. I use the horrible filter plugin thingy to get
the transparency working on IE5+/Win, and it works fine here on IE6.
no dotted underline of
the menu items, not centered.
http://locusmeus.com/html-css/centeringpage.html

I'll look into that as well. Note that your "centered in IE5 only" page
is centred in Firefox 0.9.2/Win2K here...

Thanks for your help and suggestions.

--
Mark.

[Els]

Mark Tranchant wrote:

Els wrote:

Mark Tranchant wrote:

http://step-by-step.org.uk/

IE5.01 and 5.5 on WinXP: no crayons,

Gak! That's annoying. Any ideas why? The crayon <div>
contains the crayon image as an <img> for IE5/Mac only, and
has it set as a background for others. I use the horrible
filter plugin thingy to get the transparency working on
IE5+/Win, and it works fine here on IE6.

Works on IE6 here too.
Don't know.. I have no clue about that "filter plugin thingy".
Maybe the <img> is covering the background?

no dotted underline of
the menu items, not centered.
http://locusmeus.com/html-css/centeringpage.html

I'll look into that as well. Note that your "centered in
IE5 only" page is centred in Firefox 0.9.2/Win2K here...

Huh?
It isn't in my Firefox 0.8 on WinXP. I'll download 0.9.2 too
see what happens. What about the centered in anything but IE,
that one isn't on the left in your Firefox, is it? And the
'centered everywhere' one?

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Strawberry Switchblade - Since Yesterday

[Mark Tranchant]

Els wrote:

Mark Tranchant wrote:

http://step-by-step.org.uk/

IE5.01 and 5.5 on WinXP: no crayons,

Gak! That's annoying. Any ideas why? The crayon <div>
contains the crayon image as an <img> for IE5/Mac only, and
has it set as a background for others. I use the horrible
filter plugin thingy to get the transparency working on
IE5+/Win, and it works fine here on IE6.

Works on IE6 here too.
Don't know.. I have no clue about that "filter plugin thingy".
Maybe the <img> is covering the background?

Described here: http://www.alistapart.com/articles/pngopacity/
Turns out to be IE5.5+ only. Not the end of the world if older browsers
are crayon-less.

http://locusmeus.com/html-css/centeringpage.html

I'll look into that as well. Note that your "centered in
IE5 only" page is centred in Firefox 0.9.2/Win2K here...

Huh?
It isn't in my Firefox 0.8 on WinXP. I'll download 0.9.2 too
see what happens. What about the centered in anything but IE,
that one isn't on the left in your Firefox, is it? And the
'centered everywhere' one?

No, my apologies. I had too many browsers open, and was looking at it in
IE6 by mistake, where it is centred.

However, I don't see the slipping problem with Firefox 0.9.2: the
scrollbars always allow me to reach any part of the page.

--
Mark.

[Els]

Mark Tranchant wrote:

>http://step-by-step.org.uk/

IE5.01 and 5.5 on WinXP: no crayons,

Gak! That's annoying. Any ideas why? The crayon <div>
contains the crayon image as an <img> for IE5/Mac only,
and has it set as a background for others. I use the
horrible filter plugin thingy to get the transparency
working on IE5+/Win, and it works fine here on IE6.
Works on IE6 here too.
Don't know.. I have no clue about that "filter plugin
thingy". Maybe the <img> is covering the background?

Described here:
http://www.alistapart.com/articles/pngopacity/ Turns out to
be IE5.5+ only. Not the end of the world if older browsers
are crayon-less.

IE5.5+ shouldn't include 5.5? There are no crayons in 5.5...

http://locusmeus.com/html-css/centeringpage.html

I'll look into that as well. Note that your "centered in
IE5 only" page is centred in Firefox 0.9.2/Win2K here...

Huh?
It isn't in my Firefox 0.8 on WinXP. I'll download 0.9.2
too see what happens. What about the centered in anything
but IE, that one isn't on the left in your Firefox, is it?
And the 'centered everywhere' one?

No, my apologies. I had too many browsers open, and was
looking at it in IE6 by mistake, where it is centred.

Pfew! I already had the text altered when someone pointed out
IE5 on Mac was behaving correctly. Glad I don't have to revise
it again :-)
However, I don't see the slipping problem with Firefox
0.9.2: the scrollbars always allow me to reach any part of
the page.

If you set your window to less than the content's width, you
can scroll to the left? Or does the page stop at the left
border of the window? In that case, FF0.9 would be the first
Gecko to do that...

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Mark Tranchant]

Els wrote:

Mark Tranchant wrote:

>>http://step-by-step.org.uk/
>
>IE5.01 and 5.5 on WinXP: no crayons,

Gak! That's annoying. Any ideas why? The crayon <div>
contains the crayon image as an <img> for IE5/Mac only,
and has it set as a background for others. I use the
horrible filter plugin thingy to get the transparency
working on IE5+/Win, and it works fine here on IE6.

Works on IE6 here too.
Don't know.. I have no clue about that "filter plugin
thingy". Maybe the <img> is covering the background?

Described here:
http://www.alistapart.com/articles/pngopacity/ Turns out to
be IE5.5+ only. Not the end of the world if older browsers
are crayon-less.

IE5.5+ shouldn't include 5.5? There are no crayons in 5.5...

I think it should include 5.5, and am mildly peeved to hear that it
doesn't work.

However, I don't see the slipping problem with Firefox
0.9.2: the scrollbars always allow me to reach any part of
the page.

If you set your window to less than the content's width, you
can scroll to the left? Or does the page stop at the left
border of the window? In that case, FF0.9 would be the first
Gecko to do that...

The former:

http://tranchant.plus.com/tmp/scroll

--
Mark.

[Els]

Mark Tranchant wrote:

Described here:
http://www.alistapart.com/articles/pngopacity/ Turns out
to be IE5.5+ only. Not the end of the world if older
browsers are crayon-less.

IE5.5+ shouldn't include 5.5? There are no crayons in
5.5...

I think it should include 5.5, and am mildly peeved to hear
that it doesn't work.

Mildly peeved? You must have a different character than I have
<g>

However, I don't see the slipping problem with Firefox
0.9.2: the scrollbars always allow me to reach any part of
the page.

If you set your window to less than the content's width,
you can scroll to the left? Or does the page stop at the
left border of the window? In that case, FF0.9 would be
the first Gecko to do that...

The former:

http://tranchant.plus.com/tmp/scroll

Which indicates the latter, but that's nitpicking.
I just downloaded 0.9.2, and indeed, it's not a Win2000 thing,
but a Firefox 0.9.2 thing. I'll have to adjust my pageslipping
page: All Gecko's but the latest Firefox, version 0.9.2....

Can't these browsers just stick to their problems? ;-)

But you'll still have to make some change in the code for all
the other Gecko's, as per this printscreen from Firebird:
http://locusmeus.com/temp/step-by-step.jpg
That's what it looked like in Firefox 0.8 too.

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Els]

Mark Tranchant wrote:

Don't know.. I have no clue about that "filter plugin
thingy". Maybe the <img> is covering the background?

Described here:
http://www.alistapart.com/articles/pngopacity/ Turns out to
be IE5.5+ only. Not the end of the world if older browsers
are crayon-less.

One more thing I can think of why it doesn't work in IE5.5:
You state the CSS for IE5 as /css/ie
Maybe IE doesn't take that for a CSS file for some reason?
Would it perhaps work if you gave it the .css extension?

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Mark Tranchant]

Els wrote:

But you'll still have to make some change in the code for all
the other Gecko's, as per this printscreen from Firebird:
http://locusmeus.com/temp/step-by-step.jpg
That's what it looked like in Firefox 0.8 too.

Oh, right! I understand the problem now. My inability to reliably
remember which is left and which is right confused me. I thought the
problem behaviour was as Firefox 0.9.2 shows but with the scrollbar not
available - that is, the *right* hand side of the page inaccessible.

Does it work now?

Also, could you see if the crayons are back on IE5.5 please?

Muchas gracias,

--
Mark.

[Els]

Mark Tranchant wrote:

Els wrote:

But you'll still have to make some change in the code for
all the other Gecko's, as per this printscreen from
Firebird: http://locusmeus.com/temp/step-by-step.jpg
That's what it looked like in Firefox 0.8 too.
Oh, right! I understand the problem now. My inability to
reliably remember which is left and which is right confused
me.

I'll try and remember that next time ;-)
I thought the problem behaviour was as Firefox 0.9.2
shows but with the scrollbar not available - that is, the
*right* hand side of the page inaccessible.

Does it work now?
Yep :-)
Also, could you see if the crayons are back on IE5.5
please?
They're still not there, unfortunately...
Muchas gracias,

De nada :-)
(if that's Spanish)

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Mark Tranchant]

Els wrote:

One more thing I can think of why it doesn't work in IE5.5:
You state the CSS for IE5 as /css/ie
Maybe IE doesn't take that for a CSS file for some reason?
Would it perhaps work if you gave it the .css extension?

No - you are loading it OK:

xx-xxx-xxx-xxx-bbxl.xdsl.tiscali.nl - - [21/Jul/2004:13:58:26 +0100]
"GET /css/ie HTTP/1.1" 200 133 "http://step-by-step.org.uk/"
"Mozilla/4.0 (compatible; MSIE 5.5; Windows NT 5.1; Wish; Feedreader)"

Experience on other sites shows this works, and you are also
successfully loading the main stylesheet, layout.css, also referenced
without extension.

--
Mark.

[Els]

Mark Tranchant wrote:

Els wrote:

One more thing I can think of why it doesn't work in
IE5.5: You state the CSS for IE5 as /css/ie
Maybe IE doesn't take that for a CSS file for some reason?
Would it perhaps work if you gave it the .css extension?
No - you are loading it OK:

xx-xxx-xxx-xxx-bbxl.xdsl.tiscali.nl - -
[21/Jul/2004:13:58:26 +0100] "GET /css/ie HTTP/1.1" 200 133
"http://step-by-step.org.uk/" "Mozilla/4.0 (compatible;
MSIE 5.5; Windows NT 5.1; Wish; Feedreader)"

The fact it was loaded doesn't have to mean it's loaded as MIME
type text/css I think?
Experience on other sites shows this works, and you are
also successfully loading the main stylesheet, layout.css,
also referenced without extension.

You just changed that :-)
So, alas, that wasn't the problem :-(

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[jake]

In message <Z6*******************@stones.force9.net>, Mark Tranchant
<ma**@tranchant.plus.com> writes

A new project:

http://step-by-step.org.uk/
[snip]

3) Any suggestions or comments?

Thanks!

"....... Welcome to the step-by-step preschool website. You are using a
browser without CSS support, so this site will appear plain but fully
accessible. ......"

Or a browser that *does* support CSS, but is using an alternative
stylesheet ;-)

regards.

--
Jake

[Els]

jake wrote:

"....... Welcome to the step-by-step preschool website. You
are using a browser without CSS support, so this site will
appear plain but fully accessible. ......"

Or a browser that *does* support CSS, but is using an
alternative stylesheet ;-)

I'm having a deja vu...

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Matti Caspi - Lost in Faith

[Brian]

Els wrote:

You state the CSS for IE5 as /css/ie Maybe IE doesn't take that for
a CSS file for some reason? Would it perhaps work if you gave it
the .css extension?

Doubtful. MSIE/Win only uses a file extension where other methods
(content sniffing and MIME type, for two) have failed. A "file
extension" on a url is sort of meaningless on the client end.

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/

[Els]

Brian wrote:

Els wrote:

You state the CSS for IE5 as /css/ie Maybe IE doesn't take
that for a CSS file for some reason? Would it perhaps work
if you gave it the .css extension?

Doubtful. MSIE/Win only uses a file extension where other
methods (content sniffing and MIME type, for two) have
failed. A "file extension" on a url is sort of meaningless
on the client end.

Thanks, I thought that the extension might be part of the
sniffing IE does. So, not. :-)

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Soft Cell - Tainted Love

[Alan J. Flavell]

On Wed, 21 Jul 2004, Els wrote:

Brian wrote:

Doubtful. MSIE/Win only uses a file extension where other
methods (content sniffing and MIME type, for two) have
failed. A "file extension" on a url is sort of meaningless
on the client end.

Thanks, I thought that the extension might be part of the
sniffing IE does.

Potentially, it could be. As Brian rightly said - for the MIME types
which are on their "moniker" hit-list:

MSIE/Win only uses a file extension where other methods (content
sniffing and MIME type, for two) have failed.

If you really want the gruesome details, search out MS's actual
writeup on this. :-}

[Els]

Alan J. Flavell wrote:

On Wed, 21 Jul 2004, Els wrote:

Brian wrote:

> Doubtful. MSIE/Win only uses a file extension where
> other methods (content sniffing and MIME type, for two)
> have failed. A "file extension" on a url is sort of
> meaningless on the client end.
Thanks, I thought that the extension might be part of the
sniffing IE does.

Potentially, it could be. As Brian rightly said - for the
MIME types which are on their "moniker" hit-list:

> MSIE/Win only uses a file extension where other methods
> (content sniffing and MIME type, for two) have failed.

That's what I meant, it isn't part of the sniffing. Only if
that fails, and then the MIME type fails, the third option is
the file extension. No sniffing. Just reading ;-)
If you really want the gruesome details, search out MS's
actual writeup on this. :-}

Ermm... no thanks.
I try to limit reading gruesome details to a minimum. ;-)

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: UB 40 - Kingston Town

[Claire Tucker]

On Wed, 21 Jul 2004 10:59:19 +0100, Mark Tranchant
<ma**@tranchant.plus.com> wrote:

A new project:

http://step-by-step.org.uk/

Don't worry about the links yet, the content hasn't been written. I'm
just interested in the introduction screen, which is my first attempt at
an absolutely-positioned layout.

You already got plenty of feedback about the rendering of the CSS, so
I won't bother with that...

I just wanted to make a big deal of the fact that, when I hit the
"ignore author-specified styles" toggle in my browser, it became a
perfectly-sensible, orderly and simple page which worked nicely with
my user-stylesheet. No artifacts of the design cluttering the screen,
and no bizarre interactions with my stylesheet.

Nice one :)

I browse with document styles disabled quite a lot, because I have my
user stylesheet set up to be pretty and readable. It's rare I see a
site which doesn't have some kind of leftover presentational junk when
I do so, unless I've made a special effort to filter it.

-Claire

(Labelling the crayons with the caption "CRAYONS" seems like a strange
thing to do. Are there really crayons like that, and shouldn't it
really say "CRAYON" instead? :) )

[jake]

In message <Xn*****************@130.133.1.4>, Els
<el*********@tiscali.nl> writes

jake wrote:

"....... Welcome to the step-by-step preschool website. You
are using a browser without CSS support, so this site will
appear plain but fully accessible. ......"

Or a browser that *does* support CSS, but is using an
alternative stylesheet ;-)

I'm having a deja vu...

...... not illegal yet ....... but probably taxable .....

regards.
--
Jake

[Els]

jake wrote:

In message <Xn*****************@130.133.1.4>, Els
<el*********@tiscali.nl> writes

jake wrote:

"....... Welcome to the step-by-step preschool website. You
are using a browser without CSS support, so this site will
appear plain but fully accessible. ......"

Or a browser that *does* support CSS, but is using an
alternative stylesheet ;-)

I'm having a deja vu...

..... not illegal yet ....... but probably taxable .....

<g>
Tax deductable I hope...

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Alanis Morissette - You Oughta Know

[Mark Tranchant]

Claire Tucker wrote:

On Wed, 21 Jul 2004 10:59:19 +0100, Mark Tranchant

http://step-by-step.org.uk/

I just wanted to make a big deal of the fact that, when I hit the
"ignore author-specified styles" toggle in my browser, it became a
perfectly-sensible, orderly and simple page which worked nicely with
my user-stylesheet. No artifacts of the design cluttering the screen,
and no bizarre interactions with my stylesheet.

Nice one :)
Thanks. Being an ex-Lynx user helps me remember to do this.
(Labelling the crayons with the caption "CRAYONS" seems like a strange
thing to do. Are there really crayons like that, and shouldn't it
really say "CRAYON" instead? :) )

The crayon photo is completely genuine and unmanipulated, except for:

1) The red crayon is in fact grey, as my daughter broke the real red one
during a scribbling frenzy. That's why the specular highlights on that
label are tinted red.

2) The shadow is fake, as the real one didn't look right.

The other side of the label says "MADE IN CHINA".

--
Mark.
http://tranchant.plus.com/