CSS1: A id selector and a child class selector doesn't cascade margin-top

RESOLVED INVALID

Status

()

RESOLVED INVALID
15 years ago
15 years ago

People

(Reporter: scott.hamilton, Unassigned)

Tracking

Trunk
x86
Linux
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(URL)

(Reporter)

Description

15 years ago
User-Agent:       Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.4a) Gecko/20030401
Build Identifier: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.4a) Gecko/20030401

In my Cascading Style Sheet, I have a ID selector (#menu), I want the
first child with a class selector (div.activeSectionBox or div.sectionBox) to
have a different margin-top. So I used the + operator, the CSS would look like;

#menu + div.activeSectionBox {
   margin-top: 25px
}

#menu div.activeSectionBox {
   a heap of other CSS attributes
   but does NOT set any margin attributes.
}

If I use > or simply #menu div.activeSectionBox { 
the margin-top attribute is rendered

I've put a complete example at http://goat.admin.net.au/moz_bug_css.html
You will notice the box with "First Option" is very close to the top of
the blue DIV#menu box. It should be 25px further down....

Reproducible: Always

Steps to Reproduce:
1. CSS with a id selector + class selector
2. set CSS Attributes.
3. id selector and class selector
4. set more attributes.

Actual Results:  
the first block doesn't cascade.

Expected Results:  
the attributes should have been rendered where a specific class selector is the
first child of a specified id selector.

Comment 1

15 years ago
This is what you want 
#menu > div.activeSectionBox:first-child{
    background: black;
    margin-top: 25px
}
Adjacent sibling selectors:
E + F = E and F share the same parent and where E comes directly before F
Child selectors
E > F = E is the parent of F
:first-child pseudo-class
E > F:first-child = E is the parent of F which is also the first child of E

http://www.w3.org/TR/CSS21/selector.html#q1
(Reporter)

Comment 2

15 years ago
Many thanks, my reading/memory was wrong...
This works wonderfully now!

Comment 3

15 years ago
Mark as invalid? :-)
invalid per comments
Status: UNCONFIRMED → RESOLVED
Last Resolved: 15 years ago
Resolution: --- → INVALID
You need to log in before you can comment on or make changes to this bug.