Problem in css.maxdesign.com.au tutorial

Hi,

I've been working through the css.maxdesign.com.au/selectutorial/
tutorial_step10.htm, and I'm up to Step 10.

I've published the cumulative result of the first 10 steps as
http://home.comcast.net/~CaptQueeg/T...lLayout_10.htm (and .css).
Both files pass the respective W3C validations.

There are a couple of minor problems, such as the blue background that
seems misplaced, but I expect that will be resolved in future steps
as elements are positioned differently.

The problem in Step 10 is that attributes for div#navigation were
supplied, particularly "list-style-type: none;" intended to apply to
the <ul> element that's subordinate to div. My editor displayed this
page and the discs in the <li>'s were still displayed. That's also
true in IE7 and FireFox2.

I thought perhaps the problem was that the "list-style-type: none;"
was being applied to the <ul>'s container (the <div>) and not directly
to the <ul> itself. So I added:

ul div#navigation
{
list-style-type: none;
padding: 0;
margin: 0;

}

That didn't help.

Just before I posted this I tried "#navigation ul { list-style-type:
none; }". That WORKED!
(I didn't include this in the published version.)

So what's up?
1. Is MaxDesign simply wrong?
2. I read somewhere that the "ul div#navigation" was a way provide
styling to an element inside a container. Is there a tweak to that
which would make it work?
3. Is "#navigation ul { list-style-type: none; }". the only style
statement that will work.


Thanks in Advance,
Richard

In article
<1186717603.684796.293430 (AT) x35g2000prf (DOT) googlegroups.com>,
RichardL <RichardDummyMailbox58407 (AT) USComputerGurus (DOT) com> wrote:

ul div#navigation
{
list-style-type: none;
padding: 0;
margin: 0;

}

That didn't help.

Just before I posted this I tried "#navigation ul { list-style-type:
none; }". That WORKED!
(I didn't include this in the published version.)

So what's up?

Well, without looking closely, ul div#navigation speaks to a div
that is inside a ul, how likely is that in a well ordered real
world?

Whereas #navigation ul speaks to a very likely thing, namely a
list inside an element of id "navigation", probably a div.

--
dorayme

On Aug 10, 12:10 am, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:

In article
1186717603.684796.293... (AT) x35g2000prf (DOT) googlegroups.com>,



RichardL <RichardDummyMailbox58... (AT) USComputerGurus (DOT) com> wrote:
ul div#navigation
{
list-style-type: none;
padding: 0;
margin: 0;

}

That didn't help.

Just before I posted this I tried "#navigation ul { list-style-type:
none; }". That WORKED!
(I didn't include this in the published version.)

So what's up?

Well, without looking closely, ul div#navigation speaks to a div
that is inside a ul, how likely is that in a well ordered real
world?

Whereas #navigation ul speaks to a very likely thing, namely a
list inside an element of id "navigation", probably a div.

--
dorayme

Hi dorayme,

Great! So the semantics of "x y{stuff}" is the stuff applies to the y
object subordinate to the x object. That's really what I didn't know.

Secondly, after reviewing all this stuff, I discovered that
MaxDesign's tutorial had "div#navigation ul {...}" but I dropped the
"ul" in in adding their code to my incremental version.

But if I had been aware of the semantics you explained, I wouldn't
have jumped through so many hoops to get this working.

Many thanks,
Richard

RichardL wrote:

dorayme wrote:

So what's up?


Well, without looking closely, ul div#navigation speaks to a div
that is inside a ul, how likely is that in a well ordered real
world?

Whereas #navigation ul speaks to a very likely thing, namely a
list inside an element of id "navigation", probably a div.


Hi dorayme,

Great! So the semantics of "x y{stuff}" is the stuff applies to the y
object subordinate to the x object. That's really what I didn't know.

....
But if I had been aware of the semantics you explained, I wouldn't
have jumped through so many hoops to get this working.

Take a look at
http://www.htmldog.com/guides/cssintermediate/grouping/

Congratulations, you have graduated to the "intermediate" class
now! <g>

--
dorayme

On Aug 10, 5:40 pm, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:

RichardL wrote:
dorayme wrote:
So what's up?

Well, without looking closely, ul div#navigation speaks to a div
that is inside a ul, how likely is that in a well ordered real
world?

Whereas #navigation ul speaks to a very likely thing, namely a
list inside an element of id "navigation", probably a div.

Hi dorayme,

Great! So the semantics of "x y{stuff}" is the stuff applies to the y
object subordinate to the x object. That's really what I didn't know.

...
But if I had been aware of the semantics you explained, I wouldn't
have jumped through so many hoops to get this working.

Take a look athttp://www.htmldog.com/guides/cssintermediate/grouping/

Congratulations, you have graduated to the "intermediate" class
now! <g

--
dorayme

Hi dorayme,

http://www.htmldog.com/guides/cssintermediate/grouping/

That's an excellent site in terms of its graduated content, aesthetic
presentation and navigational simplicity. Thanks.

Congratulations, you have graduated to the "intermediate" class now! <g

Thanks. I finished all 22 steps of http://css.maxdesign.com.au/selectut...rial_step1.htm.
That was very informative, as I expect HtmlDog site will be. A
systematic study of these tutorials is a far more effective way to
learn CSS than the ad hoc, trial and error, newsgroup supported
approach I started out with.

Best wishes,
Richard