Are there any css experts here with access to IE6?

D

Dave Rado

This is a repost - I originally posted this in frontpage.programming, and an
MVP there suggested I try posting it here as this newsgroup gets a lot more
traffic. It is a high-level css question rather than a FrontPage one,
relating to how to work around some IE6 and 7 css bugs; and you need to have
access to IE6 and 7 in order to be able to help me with this. If you are a
css expert with access to IE 6 and 7, and if you enjoy an intellectual
challenge, please read on.

***

I was very excited to discover recently a method of using css to emulate
frames in the sense that it keeps the header and footer static and visible
while you scroll down a page, but does so in a way that is both
bookmarks-friendly and search-engine-friendly (unlike real frames, which are
neither). This is something my users would very much like me to implement.

However, I have hit some snags with IE6 and 7 and would appreciate the help
of any css experts here with solving these problems.

The reason I'm posting here rather than in a specialist css newsgroup is
that I've found that the people in the latter tend not to be very keen to
help me work around IE-specific problems.

In essence, the method I found works as follows:

1) For all non-Microsoft browsers and for IE7 in strict mode, it uses a
scrollable content div that has a value for the top and bottom properties
equal to the height of the header and footer divs, respectively; and
overflow is set to auto for that div. The header and footer divs have
overflow set to hidden.

2) For IE5.x and for IE6 and 7 in quirks mode, it uses a scrollable content
div that has a value for the top and bottom borders equal to the height of
the header and footer divs, respectively. (Same overflow values as above).

The website that I first saw this technique being used on was using a
doctype that makes IE6 and 7 go into quirks mode. However, I use a doctype
that makes IE6 and 7 go into strict mode and I am very reluctant to change
that. The sharp-eyed amongst you will have already realised from 1) and 2)
above that as far as I can see, neither technique works for IE6 in strict
mode - more on that below.

I have created a mock-up of the technique working with a doctype that makes
IE6 and above go into quirks mode, at: http://tinyurl.com/3dl4vn .

To see what I mean about it being bookmarks-friendly, go to the page the
above url expands to, and then append #sec1 to the end of the url, and press
<Enter>. It goes straight to the bookmark, in all browsers.

There are a few minor problems with this technique that I have already
thought of workarounds for:

1) It doesn't print properly, but I'll create a print media stylesheet so
that it does.

2) In Opera and Safari, and in all browsers that have javascript disabled,
you have to click on the scrollable area of the page in order to set the
focus to it before you can scroll with the keyboard (although scrolling with
the mouse works normally). In IE and Firefox, with javascript enabled, you
can scroll with the keyboard as soon as the page has loaded. I don't really
see this as a major problem, and for any users that do, I will in any case
be providing an alternative stylesheet that doesn't use pseudo-frames.

3) In IE7, if you zoom, the page becomes a complete mess, especially if you
press Ctrl+ more than once. More on that later. But my current workaround
for this problem is to provide an alternative stylesheet that doesn't use
pseudo-frames, for the sake of those IE7 users who need to be able to zoom.
I also use larger default font-sizes and line-height, and fewer characters
per line, than the average website does, which should hopefully greatly
reduce the number of people who feel the need to zoom in any case. (BTW, as
an aside, does anyone know IE's zoom bugs have been fixed in version 8 beta?
IE7's zoom is simply awful. My pages zoom beautifully in Opera, without any
problems at all!)

***

I have created a second mock-up of the technique working with a doctype that
makes IE6 and above go into strict mode, at: http://tinyurl.com/378ub4 . As
you can see it works perfectly (subject to the above qualifications) in all
browsers *except* IE6. In IE6 it's a complete mess, especially if you try
going to a bookmark (as before, append #sec1 to the end of the expanded url,
and press <Enter> to see what I mean).

Can anyone see any modifications I can make to my css in order to allow this
technique to work in IE6 in strict mode?

I have already found a workaround to this problem, but I don't like it. If
one precedes the doctype declaration with the string:
<?xml version="1.0" encoding="iso-8859-1"?>
.... then IE6 works in quirks mode, whereas IE7 and above work in strict
mode. Using this technique I have managed to get it working in all
browsers - see my third mock-up, at http://tinyurl.com/35zrqg . But I'd much
rather have IE6 working in strict mode if possible.

***

So I really have two questions:

1) Can anyone think of any modifications to the css in my second mock-up
that would allow the technique to work in IE6 when in strict mode?

2) Can anyone think of any modifications to the css that would allow one to
zoom when in IE7 without the page turning into a complete mess? (When one
zooms using Ctrl+ in IE7, the footer jumps all over the place, and also, one
can't scroll to the bottom of the screen with either the scrollbar or the
keyboard - the only way to scroll to the bottom is with the mouse wheel!)

Dave
 
C

Corey Bryant

For access to IE 6.0 - you might check out browsercam.com or anybrowser.com
for access to IE 6.0

For possible IE 6.0 CSS hacks, I recommend www.iwdn.net
 
D

Dave Rado

Hi Corey

I have IE 5.5, 6 and 7 running simultaneously. There's a much better way of
testing in them than using browser.com - they can all co-exist on one
machine, without any need to run multiple virtual operating systems,
contrary to popular belief - see http://tredosoft.com/Multiple_IE for
details of how to install them.

I don't believe that www.iwdn.net contains any information that is relevant
to the specific problems I described. If you think I am wrong, I'd be
grateful if you could post the specific code from there that is relevant to
the problem I described.

Dave


| For access to IE 6.0 - you might check out browsercam.com or
anybrowser.com
| for access to IE 6.0
|
| For possible IE 6.0 CSS hacks, I recommend www.iwdn.net
|
|
| --
| Corey R. Bryant
| http://www.milehighmerchantaccount.com/ | http://www.mychoicevoice.com/ |
| http://www.mymerchantaccountblog.com/ | http://www.loudexpressions.com/
|
|
| "Dave Rado" wrote:
|
| > This is a repost - I originally posted this in frontpage.programming,
and an
| > MVP there suggested I try posting it here as this newsgroup gets a lot
more
| > traffic. It is a high-level css question rather than a FrontPage one,
| > relating to how to work around some IE6 and 7 css bugs; and you need to
have
| > access to IE6 and 7 in order to be able to help me with this. If you are
a
| > css expert with access to IE 6 and 7, and if you enjoy an intellectual
| > challenge, please read on.
| >
| > ***
| >
| > I was very excited to discover recently a method of using css to emulate
| > frames in the sense that it keeps the header and footer static and
visible
| > while you scroll down a page, but does so in a way that is both
| > bookmarks-friendly and search-engine-friendly (unlike real frames, which
are
| > neither). This is something my users would very much like me to
implement.
| >
| > However, I have hit some snags with IE6 and 7 and would appreciate the
help
| > of any css experts here with solving these problems.
| >
| > The reason I'm posting here rather than in a specialist css newsgroup is
| > that I've found that the people in the latter tend not to be very keen
to
| > help me work around IE-specific problems.
| >
| > In essence, the method I found works as follows:
| >
| > 1) For all non-Microsoft browsers and for IE7 in strict mode, it uses a
| > scrollable content div that has a value for the top and bottom
properties
| > equal to the height of the header and footer divs, respectively; and
| > overflow is set to auto for that div. The header and footer divs have
| > overflow set to hidden.
| >
| > 2) For IE5.x and for IE6 and 7 in quirks mode, it uses a scrollable
content
| > div that has a value for the top and bottom borders equal to the height
of
| > the header and footer divs, respectively. (Same overflow values as
above).
| >
| > The website that I first saw this technique being used on was using a
| > doctype that makes IE6 and 7 go into quirks mode. However, I use a
doctype
| > that makes IE6 and 7 go into strict mode and I am very reluctant to
change
| > that. The sharp-eyed amongst you will have already realised from 1) and
2)
| > above that as far as I can see, neither technique works for IE6 in
strict
| > mode - more on that below.
| >
| > I have created a mock-up of the technique working with a doctype that
makes
| > IE6 and above go into quirks mode, at: http://tinyurl.com/3dl4vn .
| >
| > To see what I mean about it being bookmarks-friendly, go to the page the
| > above url expands to, and then append #sec1 to the end of the url, and
press
| > <Enter>. It goes straight to the bookmark, in all browsers.
| >
| > There are a few minor problems with this technique that I have already
| > thought of workarounds for:
| >
| > 1) It doesn't print properly, but I'll create a print media stylesheet
so
| > that it does.
| >
| > 2) In Opera and Safari, and in all browsers that have javascript
disabled,
| > you have to click on the scrollable area of the page in order to set the
| > focus to it before you can scroll with the keyboard (although scrolling
with
| > the mouse works normally). In IE and Firefox, with javascript enabled,
you
| > can scroll with the keyboard as soon as the page has loaded. I don't
really
| > see this as a major problem, and for any users that do, I will in any
case
| > be providing an alternative stylesheet that doesn't use pseudo-frames.
| >
| > 3) In IE7, if you zoom, the page becomes a complete mess, especially if
you
| > press Ctrl+ more than once. More on that later. But my current
workaround
| > for this problem is to provide an alternative stylesheet that doesn't
use
| > pseudo-frames, for the sake of those IE7 users who need to be able to
zoom.
| > I also use larger default font-sizes and line-height, and fewer
characters
| > per line, than the average website does, which should hopefully greatly
| > reduce the number of people who feel the need to zoom in any case.
(BTW, as
| > an aside, does anyone know IE's zoom bugs have been fixed in version 8
beta?
| > IE7's zoom is simply awful. My pages zoom beautifully in Opera, without
any
| > problems at all!)
| >
| > ***
| >
| > I have created a second mock-up of the technique working with a doctype
that
| > makes IE6 and above go into strict mode, at: http://tinyurl.com/378ub4 .
As
| > you can see it works perfectly (subject to the above qualifications) in
all
| > browsers *except* IE6. In IE6 it's a complete mess, especially if you
try
| > going to a bookmark (as before, append #sec1 to the end of the expanded
url,
| > and press <Enter> to see what I mean).
| >
| > Can anyone see any modifications I can make to my css in order to allow
this
| > technique to work in IE6 in strict mode?
| >
| > I have already found a workaround to this problem, but I don't like it.
If
| > one precedes the doctype declaration with the string:
| > <?xml version="1.0" encoding="iso-8859-1"?>
| > .... then IE6 works in quirks mode, whereas IE7 and above work in strict
| > mode. Using this technique I have managed to get it working in all
| > browsers - see my third mock-up, at http://tinyurl.com/35zrqg . But I'd
much
| > rather have IE6 working in strict mode if possible.
| >
| > ***
| >
| > So I really have two questions:
| >
| > 1) Can anyone think of any modifications to the css in my second mock-up
| > that would allow the technique to work in IE6 when in strict mode?
| >
| > 2) Can anyone think of any modifications to the css that would allow one
to
| > zoom when in IE7 without the page turning into a complete mess? (When
one
| > zooms using Ctrl+ in IE7, the footer jumps all over the place, and also,
one
| > can't scroll to the bottom of the screen with either the scrollbar or
the
| > keyboard - the only way to scroll to the bottom is with the mouse
wheel!)
| >
| > Dave
| >
| >
| >
 
D

Dave Rado

Hi again Corey

I've just realised that I may have misunderstood your point about
www.iwdn.net - did you mean that I should re-post my question in one of
their forums?

Dave


| For access to IE 6.0 - you might check out browsercam.com or
anybrowser.com
| for access to IE 6.0
|
| For possible IE 6.0 CSS hacks, I recommend www.iwdn.net
|
|
| --
| Corey R. Bryant
| http://www.milehighmerchantaccount.com/ | http://www.mychoicevoice.com/ |
| http://www.mymerchantaccountblog.com/ | http://www.loudexpressions.com/
|
|
| "Dave Rado" wrote:
|
| > This is a repost - I originally posted this in frontpage.programming,
and an
| > MVP there suggested I try posting it here as this newsgroup gets a lot
more
| > traffic. It is a high-level css question rather than a FrontPage one,
| > relating to how to work around some IE6 and 7 css bugs; and you need to
have
| > access to IE6 and 7 in order to be able to help me with this. If you are
a
| > css expert with access to IE 6 and 7, and if you enjoy an intellectual
| > challenge, please read on.
| >
| > ***
| >
| > I was very excited to discover recently a method of using css to emulate
| > frames in the sense that it keeps the header and footer static and
visible
| > while you scroll down a page, but does so in a way that is both
| > bookmarks-friendly and search-engine-friendly (unlike real frames, which
are
| > neither). This is something my users would very much like me to
implement.
| >
| > However, I have hit some snags with IE6 and 7 and would appreciate the
help
| > of any css experts here with solving these problems.
| >
| > The reason I'm posting here rather than in a specialist css newsgroup is
| > that I've found that the people in the latter tend not to be very keen
to
| > help me work around IE-specific problems.
| >
| > In essence, the method I found works as follows:
| >
| > 1) For all non-Microsoft browsers and for IE7 in strict mode, it uses a
| > scrollable content div that has a value for the top and bottom
properties
| > equal to the height of the header and footer divs, respectively; and
| > overflow is set to auto for that div. The header and footer divs have
| > overflow set to hidden.
| >
| > 2) For IE5.x and for IE6 and 7 in quirks mode, it uses a scrollable
content
| > div that has a value for the top and bottom borders equal to the height
of
| > the header and footer divs, respectively. (Same overflow values as
above).
| >
| > The website that I first saw this technique being used on was using a
| > doctype that makes IE6 and 7 go into quirks mode. However, I use a
doctype
| > that makes IE6 and 7 go into strict mode and I am very reluctant to
change
| > that. The sharp-eyed amongst you will have already realised from 1) and
2)
| > above that as far as I can see, neither technique works for IE6 in
strict
| > mode - more on that below.
| >
| > I have created a mock-up of the technique working with a doctype that
makes
| > IE6 and above go into quirks mode, at: http://tinyurl.com/3dl4vn .
| >
| > To see what I mean about it being bookmarks-friendly, go to the page the
| > above url expands to, and then append #sec1 to the end of the url, and
press
| > <Enter>. It goes straight to the bookmark, in all browsers.
| >
| > There are a few minor problems with this technique that I have already
| > thought of workarounds for:
| >
| > 1) It doesn't print properly, but I'll create a print media stylesheet
so
| > that it does.
| >
| > 2) In Opera and Safari, and in all browsers that have javascript
disabled,
| > you have to click on the scrollable area of the page in order to set the
| > focus to it before you can scroll with the keyboard (although scrolling
with
| > the mouse works normally). In IE and Firefox, with javascript enabled,
you
| > can scroll with the keyboard as soon as the page has loaded. I don't
really
| > see this as a major problem, and for any users that do, I will in any
case
| > be providing an alternative stylesheet that doesn't use pseudo-frames.
| >
| > 3) In IE7, if you zoom, the page becomes a complete mess, especially if
you
| > press Ctrl+ more than once. More on that later. But my current
workaround
| > for this problem is to provide an alternative stylesheet that doesn't
use
| > pseudo-frames, for the sake of those IE7 users who need to be able to
zoom.
| > I also use larger default font-sizes and line-height, and fewer
characters
| > per line, than the average website does, which should hopefully greatly
| > reduce the number of people who feel the need to zoom in any case.
(BTW, as
| > an aside, does anyone know IE's zoom bugs have been fixed in version 8
beta?
| > IE7's zoom is simply awful. My pages zoom beautifully in Opera, without
any
| > problems at all!)
| >
| > ***
| >
| > I have created a second mock-up of the technique working with a doctype
that
| > makes IE6 and above go into strict mode, at: http://tinyurl.com/378ub4 .
As
| > you can see it works perfectly (subject to the above qualifications) in
all
| > browsers *except* IE6. In IE6 it's a complete mess, especially if you
try
| > going to a bookmark (as before, append #sec1 to the end of the expanded
url,
| > and press <Enter> to see what I mean).
| >
| > Can anyone see any modifications I can make to my css in order to allow
this
| > technique to work in IE6 in strict mode?
| >
| > I have already found a workaround to this problem, but I don't like it.
If
| > one precedes the doctype declaration with the string:
| > <?xml version="1.0" encoding="iso-8859-1"?>
| > .... then IE6 works in quirks mode, whereas IE7 and above work in strict
| > mode. Using this technique I have managed to get it working in all
| > browsers - see my third mock-up, at http://tinyurl.com/35zrqg . But I'd
much
| > rather have IE6 working in strict mode if possible.
| >
| > ***
| >
| > So I really have two questions:
| >
| > 1) Can anyone think of any modifications to the css in my second mock-up
| > that would allow the technique to work in IE6 when in strict mode?
| >
| > 2) Can anyone think of any modifications to the css that would allow one
to
| > zoom when in IE7 without the page turning into a complete mess? (When
one
| > zooms using Ctrl+ in IE7, the footer jumps all over the place, and also,
one
| > can't scroll to the bottom of the screen with either the scrollbar or
the
| > keyboard - the only way to scroll to the bottom is with the mouse
wheel!)
| >
| > Dave
| >
| >
| >
 
C

Corey Bryant

Yes, to post your question there - there are some pretty good CSS guys and
gals there that might be able to answer your question.
 
D

Dave Rado

Should I put you down as my referrer?

"Referrer If you were referred to this site by an existing member of
International Web Developers Network, enter their name here."


Dave


| Yes, to post your question there - there are some pretty good CSS guys and
| gals there that might be able to answer your question.
|
| --
| Corey R. Bryant
| http://www.milehighmerchantaccount.com/ |
| http://www.residentialofficesolutions.com/ |
| http://www.mymerchantaccountblog.com/ | http://www.loudexpressions.com/
|
|
| "Dave Rado" wrote:
|
| > Hi again Corey
| >
| > I've just realised that I may have misunderstood your point about
| > www.iwdn.net - did you mean that I should re-post my question in one of
| > their forums?
| >
| > Dave
| >
| >
| > | > | For access to IE 6.0 - you might check out browsercam.com or
| > anybrowser.com
| > | for access to IE 6.0
| > |
| > | For possible IE 6.0 CSS hacks, I recommend www.iwdn.net
| > |
| > |
| > | --
| > | Corey R. Bryant
| > | http://www.milehighmerchantaccount.com/ |
http://www.mychoicevoice.com/ |
| > | http://www.mymerchantaccountblog.com/ |
http://www.loudexpressions.com/
| > |
| > |
| > | "Dave Rado" wrote:
| > |
| > | > This is a repost - I originally posted this in
frontpage.programming,
| > and an
| > | > MVP there suggested I try posting it here as this newsgroup gets a
lot
| > more
| > | > traffic. It is a high-level css question rather than a FrontPage
one,
| > | > relating to how to work around some IE6 and 7 css bugs; and you need
to
| > have
| > | > access to IE6 and 7 in order to be able to help me with this. If you
are
| > a
| > | > css expert with access to IE 6 and 7, and if you enjoy an
intellectual
| > | > challenge, please read on.
| > | >
| > | > ***
| > | >
| > | > I was very excited to discover recently a method of using css to
emulate
| > | > frames in the sense that it keeps the header and footer static and
| > visible
| > | > while you scroll down a page, but does so in a way that is both
| > | > bookmarks-friendly and search-engine-friendly (unlike real frames,
which
| > are
| > | > neither). This is something my users would very much like me to
| > implement.
| > | >
| > | > However, I have hit some snags with IE6 and 7 and would appreciate
the
| > help
| > | > of any css experts here with solving these problems.
| > | >
| > | > The reason I'm posting here rather than in a specialist css
newsgroup is
| > | > that I've found that the people in the latter tend not to be very
keen
| > to
| > | > help me work around IE-specific problems.
| > | >
| > | > In essence, the method I found works as follows:
| > | >
| > | > 1) For all non-Microsoft browsers and for IE7 in strict mode, it
uses a
| > | > scrollable content div that has a value for the top and bottom
| > properties
| > | > equal to the height of the header and footer divs, respectively; and
| > | > overflow is set to auto for that div. The header and footer divs
have
| > | > overflow set to hidden.
| > | >
| > | > 2) For IE5.x and for IE6 and 7 in quirks mode, it uses a scrollable
| > content
| > | > div that has a value for the top and bottom borders equal to the
height
| > of
| > | > the header and footer divs, respectively. (Same overflow values as
| > above).
| > | >
| > | > The website that I first saw this technique being used on was using
a
| > | > doctype that makes IE6 and 7 go into quirks mode. However, I use a
| > doctype
| > | > that makes IE6 and 7 go into strict mode and I am very reluctant to
| > change
| > | > that. The sharp-eyed amongst you will have already realised from 1)
and
| > 2)
| > | > above that as far as I can see, neither technique works for IE6 in
| > strict
| > | > mode - more on that below.
| > | >
| > | > I have created a mock-up of the technique working with a doctype
that
| > makes
| > | > IE6 and above go into quirks mode, at: http://tinyurl.com/3dl4vn .
| > | >
| > | > To see what I mean about it being bookmarks-friendly, go to the page
the
| > | > above url expands to, and then append #sec1 to the end of the url,
and
| > press
| > | > <Enter>. It goes straight to the bookmark, in all browsers.
| > | >
| > | > There are a few minor problems with this technique that I have
already
| > | > thought of workarounds for:
| > | >
| > | > 1) It doesn't print properly, but I'll create a print media
stylesheet
| > so
| > | > that it does.
| > | >
| > | > 2) In Opera and Safari, and in all browsers that have javascript
| > disabled,
| > | > you have to click on the scrollable area of the page in order to set
the
| > | > focus to it before you can scroll with the keyboard (although
scrolling
| > with
| > | > the mouse works normally). In IE and Firefox, with javascript
enabled,
| > you
| > | > can scroll with the keyboard as soon as the page has loaded. I don't
| > really
| > | > see this as a major problem, and for any users that do, I will in
any
| > case
| > | > be providing an alternative stylesheet that doesn't use
pseudo-frames.
| > | >
| > | > 3) In IE7, if you zoom, the page becomes a complete mess, especially
if
| > you
| > | > press Ctrl+ more than once. More on that later. But my current
| > workaround
| > | > for this problem is to provide an alternative stylesheet that
doesn't
| > use
| > | > pseudo-frames, for the sake of those IE7 users who need to be able
to
| > zoom.
| > | > I also use larger default font-sizes and line-height, and fewer
| > characters
| > | > per line, than the average website does, which should hopefully
greatly
| > | > reduce the number of people who feel the need to zoom in any case.
| > (BTW, as
| > | > an aside, does anyone know IE's zoom bugs have been fixed in version
8
| > beta?
| > | > IE7's zoom is simply awful. My pages zoom beautifully in Opera,
without
| > any
| > | > problems at all!)
| > | >
| > | > ***
| > | >
| > | > I have created a second mock-up of the technique working with a
doctype
| > that
| > | > makes IE6 and above go into strict mode, at:
http://tinyurl.com/378ub4 .
| > As
| > | > you can see it works perfectly (subject to the above qualifications)
in
| > all
| > | > browsers *except* IE6. In IE6 it's a complete mess, especially if
you
| > try
| > | > going to a bookmark (as before, append #sec1 to the end of the
expanded
| > url,
| > | > and press <Enter> to see what I mean).
| > | >
| > | > Can anyone see any modifications I can make to my css in order to
allow
| > this
| > | > technique to work in IE6 in strict mode?
| > | >
| > | > I have already found a workaround to this problem, but I don't like
it.
| > If
| > | > one precedes the doctype declaration with the string:
| > | > <?xml version="1.0" encoding="iso-8859-1"?>
| > | > .... then IE6 works in quirks mode, whereas IE7 and above work in
strict
| > | > mode. Using this technique I have managed to get it working in all
| > | > browsers - see my third mock-up, at http://tinyurl.com/35zrqg . But
I'd
| > much
| > | > rather have IE6 working in strict mode if possible.
| > | >
| > | > ***
| > | >
| > | > So I really have two questions:
| > | >
| > | > 1) Can anyone think of any modifications to the css in my second
mock-up
| > | > that would allow the technique to work in IE6 when in strict mode?
| > | >
| > | > 2) Can anyone think of any modifications to the css that would allow
one
| > to
| > | > zoom when in IE7 without the page turning into a complete mess?
(When
| > one
| > | > zooms using Ctrl+ in IE7, the footer jumps all over the place, and
also,
| > one
| > | > can't scroll to the bottom of the screen with either the scrollbar
or
| > the
| > | > keyboard - the only way to scroll to the bottom is with the mouse
| > wheel!)
| > | >
| > | > Dave
| > | >
| > | >
| > | >
| >
| >
| >
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top