inline vs. block

[Stan McCann]

How is a novice to tell the difference between an inline and block
level element?

For many elements, it is marked as in:
<!ELEMENT FORM - - (%block;|SCRIPT)+ -(FORM) -- interactive form -->

For others, it seems that this is incorrect:
<!ELEMENT ADDRESS - - (%inline* -- information on author -->

Is this saying that address (p and possibly others) are inline elements
or am I reading it wrong? Is there someplace else in the specification
that states whether an element is inline or block?

Examples and the W3C validator clearly indicate address is a block
level element. I've been reading the recommendations frequently for
some time now and just noticed this discrepency. I'm not sure what to
make of it now since with many elements, that information seems
correct, now I see a few that seem incorrect.

Can anyone shed some light on my confusion?

 

[David Dorward]

How is a novice to tell the difference between an inline and block
level element?

The basic difference is that blocks have a line break before and after them,
while inline flow beside each other and word wrap.

For many elements, it is marked as in:
<!ELEMENT FORM - - (%block;|SCRIPT)+ -(FORM) -- interactive form -->

For others, it seems that this is incorrect:
<!ELEMENT ADDRESS - - (%inline* -- information on author -->

Is this saying that address (p and possibly others) are inline elements
or am I reading it wrong?

You are. That says that the ADDRESS element may contain "zero or more
elements in the group %inline" (and nothing else).

(The form bit says it may contain one or more elements which are either
script or in the group %block except other FORM elements).

Is there someplace else in the specification
that states whether an element is inline or block?

http://www.w3.org/TR/html4/sgml/dtd.html#block

 

[Stan McCann]

The basic difference is that blocks have a line break before and
after them, while inline flow beside each other and word wrap.

I knew that. I was looking for something to explain to those brand new

You are. That says that the ADDRESS element may contain "zero or
more elements in the group %inline" (and nothing else).

Ah. Thanks for that; the light comes on.

(The form bit says it may contain one or more elements which are
either script or in the group %block except other FORM elements).


http://www.w3.org/TR/html4/sgml/dtd.html#block

I had looked at that many times. Only after your pointing it out did I
actually perceive what it is saying. A great example of "The more I
learn, the more I realize there is so much more to learn." Thanks
much.

 

[Andy Dingley]

Read the DTD

<!ENTITY % special
"A | IMG | OBJECT | BR | SCRIPT | MAP | Q | SUB | SUP | SPAN | BDO">

<!-- %inline; covers inline or "text-level" elements -->
<!ENTITY % inline "#PCDATA | %fontstyle; | %phrase; | %special; |
%formctrl;">

These have told us that SPAN is a member (indirectly) of %inline;

The following tells us that the content model _inside_ SPAN is also
%inline;

<!ELEMENT SPAN - - (%inline* -- generic language/style
container -->
<!ATTLIST SPAN
%attrs; -- %coreattrs, %i18n, %events --
%reserved; -- reserved for possible future use --
For P we see that it's %block;, but that its content model is %inline;

<!ENTITY % block
"P | %heading; | %list; | %preformatted; | DL | DIV | NOSCRIPT |
BLOCKQUOTE | FORM | HR | TABLE | FIELDSET | ADDRESS">

<!ELEMENT P - O (%inline* -- paragraph -->
<!ATTLIST P
%attrs; -- %coreattrs, %i18n, %events --

The basic difference is that blocks have a line break before and after them,
while inline flow beside each other and word wrap.

No, this is incorrect. That's the default CSS behaviour of the element
(confusingly also called "block" and "inline" which is not the same as
the HTML content model that control valid nesting.

We can change the CSS behavious at will with the display property. We're
stuck with the HTML DTD though.

 

[Toby Inkster]

How is a novice to tell the difference between an inline and block
level element?

Say that inline elements are "phrase level" and block elements are
"paragraph level".

It's not strictly true 100% of the time, but I think that analogy shows
the "personality" of the groups of elements quite well. The details can
be taught after the personalities are grasped.

I think then they'll see why, say, <b><p>...</p></b> won't fly -- you
can't have a paragraph within a phrase -- it has to be the other way
around.

The main details that then need mentioning are:

* block elements are _typically_ rendered in a paragraph-
like manner, with a line break before and after, though
this may be changed in CSS-capable browsers.

* many block level elements _can't_ contain other block
level elements (e.g. P, H1...H6);

* others _may_ contain block level elements (e.g. DIV,
LI); and

* a handful _must_ either contain other block level elements
or remain completely empty (e.g. BLOCKQUOTE, UL, OL).

 

[Stan McCann]

Say that inline elements are "phrase level" and block elements are
"paragraph level".

I like that. Thanks Toby. Yes, I think this is something I can use to
help these total beginners.

They are already doing CSS and that's how this came up. It's funny how
you can think you know something until just the right question comes
out. I just knew the difference (experience?) and I guess expected
them to just know -- until a student asked how to tell.

As shown in my original post, I'm not comfortable with reading a DTD
(Thanks to a couple of replies, I've learned a bit about them). I
certainly don't want to try to get novices into *that* yet.