difference between css declarations

P

ppcguy

i've got

* html #menu
{
}

and

#menu span
{
}


<body>
<span id="menu">
</span>
</body>

is there a difference between the two css declarations.

i would think they're the same...but if i move the contents
from one to another i get different results.
 
B

Benjamin Niemann

ppcguy said:
i've got

* html #menu
{
}

and

#menu span
{
}


<body>
<span id="menu">
</span>
</body>

is there a difference between the two css declarations.

i would think they're the same...but if i move the contents
from one to another i get different results.

'#menu span' refers to a span inside an element with id="menu", e.g.
<div id="menu"><span>..</span></div>

What you probably want is 'span#menu'.
Then both rules would match your <span> but with different priorities, so
they are are not 'the same'.
 
D

David Håsäther

Benjamin Niemann said:
ppcguy said:
i've got

* html #menu
{
}

and

#menu span
{
}


<body>
<span id="menu">
</span>
</body>

is there a difference between the two css declarations.
[...]

What you probably want is 'span#menu'.
Then both rules would match your <span> but with different
priorities, so they are are not 'the same'.

Except, of course, that "* html #menu" will never match anything
(unless there is a buggy implementation).
 
S

Safalra

ppcguy said:
* html #menu { }

and

#menu span { }

[snip]

is there a difference between the two css declarations.

Yes. The first one shouldn't work - it matches an element with id
'menu' that is a descendant of an element of type html that is a
descendant of any element - the html element is never the descendant of
another element.

As ids have to be unique there is usually no point checking that the
element with that id is a descendant of some other element. (The only
time you'd want to do this is when applying the same stylesheet to
several documents where the position of the element with that id should
effect its display.)
 
B

Benjamin Niemann

David said:
Benjamin Niemann said:
ppcguy said:
i've got

* html #menu
{
}

and

#menu span
{
}


<body>
<span id="menu">
</span>
</body>

is there a difference between the two css declarations.
[...]

What you probably want is 'span#menu'.
Then both rules would match your <span> but with different
priorities, so they are are not 'the same'.

Except, of course, that "* html #menu" will never match anything
(unless there is a buggy implementation).

Oops. You are correct. My mind focused on the second rule..
 
P

Pete Gray

ppcguy said:
* html #menu { }

and

#menu span { }

[snip]

is there a difference between the two css declarations.

Yes. The first one shouldn't work - it matches an element with id
'menu' that is a descendant of an element of type html that is a
descendant of any element - the html element is never the descendant of
another element.

It shouldn't, but it will work in IE (only).
<http://www.info.com.ph/~etan/w3pantheon/style/starhtmlbug.html>

....thus forming the basis for a number of CSS hacks to deal with IE's
deficiencies.
 

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

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,904
Latest member
HealthyVisionsCBDPrice

Latest Threads

Top