[Top]
More advice for the full screen mode.
   
Sivut toimivat riittävän hyvin MS IE 4.0+, Opera 5.x+, Netscape 6.0+/ vast. Mozilla ja Konqueror 3.x selaimilla. Yleisesti ottaen sivut toimivat parhaiten uusimmilla Opera selaimilla. Sivujen toimivuus vanhemmissa selaimissa on heikko, erityisesti Netscape 4.x kohdalla.

I list below all topic groups, which I have done according to subjects, which they handle. You can return to this topic group by using this menu and the link Table of topic groups on the top of the each page.
 
 
Search:
[Help]

Block and inline level elements

Besides the classification elements to normal and empty elements, HTML-encoding has another main classification. The document body has two main element types, block-level elements and inline-level elements. The previous create surrounds as if an invisible rectangular box and line break before and after the element.

Block elements can be classified into some sub-classes. Common block elements are H1-H6, P, BLOCKQUOTE, OL, UL and TABLE. Block elements can usually include other block elements (there is however some exceptions, which I don't handle) and inline elements. For example this text is inside a block element! The primary task of block level elements is to work as structural, grouping and organizing elements of the content of the document.

There is two kinds of inline elements. First those kinds of inline level elements, which affect some way to the text. For example B and I belong to them and they are called as inline presentational elements. Most of these kinds of elements have certain semantic meaning. Previous elements can be expressed also with semantic elements EM (emphasized) and STRONG - this kind of elements are called as inline phrasal elements. These inline elements can be nested with each others without any limitations.

W3C: Modularization of XHTML (used terms).

These kinds of inline level elements don't create round them rectangular boxes like block-level elements. They look like a phrase in a line. The text can wrap from line to line and it might broke from different places. Inline elements, which affect to the text are commonly used to highlight some parts of the contents.

When I was in the university, some students used a thick yellow felt-tip pen in order to mark their books. I use at the same way the element CODE, which I mark as blue only those markup codes, which can be seen only from the source code - note, that the highlighted texts in this sentence have been marked with inline-level elements (CODE and STRONG).

An image of an element markup

Also the special linking element A (from the word Anchor) belongs to inline elements. It behaves like elements, which affect to the text, but is has the limitation, that links should not be nested.

Other kind of inline elements are those, which create rectangular boxes round them but however behave (unlike block elements) like a phrase in a line. These kind of elements could call according to the behavior as inline block elements. Some empty elements are as their characteristic inline elements and they behave at this way (for example IMG).

In general inline level elements should be used inside block-level elements. Some HTML versions allow to use them also stand alone, but it is not recommended to use them at that way.

It is important to set block and inline level elements correctly. The misuse is common and browsers tolerate it at some level. But it can also cause unexpected error behavior and crash the user agent. You can learn to use correct block and inline elements by reading notes to different specifications[S] and How to set CSS for table elements[S]. I defined to this site a special semantics[S] and you can learn also from that page something, how to use use elements correctly.

[Top]