Hi dorayme

On 30 Mar, 02:19, dorayme <doraymeRidT...@optusnet.com.au> wrote:

> The asterisk in css is a universal selector and unless it
> is over-ruled later in the style sheet will have all elements following
> its dictates. Thus, to look at a common example, * {margin: 0; padding:
> 0;} causes all margins and paddings to be set to zero.[1]

Thanks, that's useful to know.


> The asterisk before the html element is an interesting case and it is
> used to take advantage of what has appeared to almost everyone (except
> me to a certain extent[2]) as a bad misconception of Internet Explorer
> prior to version 7. Because IE is the only truly religious browser it
> alone recognises an element higher than the html element, and so it
> takes note of the style concerned. Whereas other more atheistic browsers
> ignore such babble. This enables authors to talk to IE and tell it to do
> things that will not bugger up the other heathen browsers.

LOL!

So is it okay for me to use * html in order to specify "applies only
to IE6 and below"? I read somewhere that it's unsafe to use because
although it validates, it's invalid, and future standards-compliant
browsers could conceivably stop ignoring it. What do you think? It
does have the huge advantage over IE conditional comments of being
usable within an external css file, so one doesn't need to import so
many css files if one uses it as one does if one uses conditional
comments. And if this hack is okay to use, in your opinion, are there
any other similar hacks that also are okay to use?


> 2. Because of my very deep studies into the mysteries of the html
> element and beyond, I have caught glimpses of the Beyond that IE6 (and
> lower) instinctively know about. In my case, I have had work hard in a
> field that is unnatural to me. I wear a special black cape and a sort of
> wizard's hat in my pursuit of what I am calling Root Studies.

In that case I hope you'll be willing to shed some light on some more
weird IE behaviour that I've just encountered (please don your cape
and wizard's hat before reading on. I could also lend you a broomstick
if you think that would ).

I've succeeding in getting my footer to stay at the bottom of the
viewport if the height of the webpage's content's is less than the
height of the viewport; and in staying at the bottom of the webpage if
the height of the webpage's content's exceeds the viewport's height;
by using the method I linked to earlier. See my mock-ups at
http://tinyurl.com/2urjf2 (short content) and at http://tinyurl.com/393k5n
(long content). However, in order to get the three icons above my
"document page" to appear in the correct place in all browsers, I had
to add the following IE conditional comment:

<!--[if lte IE 7]>
<style type="text/css">
div.TopOfPageIcons {top: 76px}
</style>
<![endif]-->

(As opposed to a top value of -8px that is required in all non-IE
browsers and in IE8 beta, according browsershots.org).

That is, in IE7 and below (but not in IE8), the TopOfPageIcons div is
positioning itself relative to the top of the webpage; whereas in all
non-IE browsers, and in IE8, the div is positioning itself relative to
the top of the DocumenPage div.

Do you have any idea why? Although I've solved the problem using the
above conditional comment, any light you can shed on this would almost
certainly greatly me in the future when encountering (or better
still anticipating) similar weird behaviour in the future.

One clue that may in your investigation: there is a div in those
mock-ups called "ScrollableContent", which has no assigned properties
(because its purpose is to be used by an alternative stylesheet, and
not by this one). Despite the fact that this div has no assigned
properties, if I delete it, then all non-IE browsers start to behave
like IE, in the sense that they position the TopOfPageIcons div
relative to the top of the page, and I then have to define
div.TopOfPageIcons to have top: 76px in all browsers. I don't
understand why an undefined div can make such a big difference? But as
I say, the ScrollableContent div needs to be there, because it's
defined in an alternative stylesheet.

Happy sleuthing!

Dave