i am facing a very strange problem. From what i understand by the CSS ">" than selector is that it basically applies style to the direct childs only. But i am not able to get the styles applied to the elements at all. What's strange is while inspecting the elements i can see the other CSS part in firebug but i can't see the ">" styles applied.

all other style is being applied as it normally would, but the style blocks that use ">" selector are not being recognized at all. So say suppose if i inspect the li element, i am able to see the following style applied:

#navigation ul li {
margin: 0px;
float: left;
position: relative;
}

But i can't see the following style applied:

#navigation > ul > li {
line-height: 26px;
display: block;
}

even though it is a direct child of the ul. Has anyone faced this problem before ? What might be causing this ?

2 Answers
2

Assuming that the HTML example you provided is the full piece of code that you're trying to apply these styles to, I don't see how there could be any conflicts occurring to warrant using the direct descendant selector (>).

Thanks @Nw167 . Though i figured out that the cms i was working on was actually wrapping the ul with a div element and so ul was not the direct children of the parent div anymore and that is why the styles were not being applied.
–
AmythOct 18 '12 at 19:24

Hey i have replaced the "display : block" by "display : none" and the style does apply on firefox.
The question is on line-height, what are you trying to achieve as final design ?
Try changing the padding or margin it you want less space.

If that is not the problem can you place maybe give us an example of the end result you are seeking ??