topic

Tabulared imposition.

Tables which were originally projected as means of performance of bidimentional data files, are now used basically as the tool for exact positioning a content on web - page. Standard HTML does not provide an opportunity to arrange a picture and the text be relative each other with comprehensible accuracy, and tabulared imposition at which various parts of a content are located in different cells of tables, is capable to solve this problem. Besides tabulared imposition is very useful at designing sites with a plenty of graphic elements: in the big figures almost always it is possible to allocate the areas which have been painted over with the same color which can be thrown out, having replaced on empty cells with a corresponding background and having saved thus on general{common} "weight" schedules and time of loading of pages. It, certainly, not unique advantage of the mentioned way of imposition. To lacks of it it is possible to attribute{relate} that fact, that some browsers (we shall not show a finger) are not capable to display already loaded parts of the content placed in the table on the screen until the table entirely will be loaded. They (the mentioned browsers) for some reason very slowly work with the enclosed tables. That is why we shall say amicably, that the Netscape is not that other as rubbish, nasty thing and generation of the Satan. Not consent I shall ask to leave.

To understand, how it is necessary "to cut" a content for a premise{room} in tables and as tables are projected, it is enough to see{overlook} an initial code of the several professionally made sites and to try to make something similar independently, therefore I shall not begin to assort in detail this subject. I shall stop only on two the most widespread tekhnikakh registrations of the tables, allowing to cope with lacks standard HTML and the problems arising at maintenance of compatibility with various browsers.

Application of wallpapers

Sometimes the designer tests insuperable desire to use as a background of the table a certain figure. We shall not speak now about that, it is good or bad. He so wants.

And the picture is prepared, optimized and registered in parameter background. The happy developer decides to start a Netscape for check to be convinced, whether so all fine looks, as assured Internet Explorer. Far from it!

The problem consists in that, at viewing page in different browsers of a cell differently inherit a background of the table. Internet Explorer considers{examines} each container <TD...> </TD> as transparent in relation to the general{common} background (if to him have not said to act differently) and in any way does not change appearance of the background image. And the Netscape counts a background of each cell independent from tabulared and traces it so much time, how much is present cells. Understandably, that anything good from this does not leave.

To cope with this problem, it is necessary to use the enclosed tables. In external the address of a background picture registers, and in internal as a background it is underlined empty URL:

<table background = "backgroundpicture.gif" width = "500"

cellpadding = "0" cellspacing = "0" border = "0">

<tr>

<td>

<table background = "" width = "500"

cellpadding = "0" cellspacing = "0" border = "0">

<tr>

</tr>

...

</table>

</td>

</tr>

<tr>

...

</tr>

</table>

The empty attribute background the internal table forces a Netscape to not display in her a background specified in external. Somebody knows, who exactly wrote a corresponding piece of a code for a Netscape? Say to me, I very much want to see fair eyes of this person.

Creation of tables with a border in 1 piksel

Let's create the elementary table with a border in one piksel, one cell containing only. A code:

<table width = "200" border = "1" cellspacing = "0"

cellpadding = "0" bordercolor = * 000000>

<tr>

</tr>

</table>

It is visible, that thickness of a border for some reason equally to two pikselam. Unfortunately, more - less decent way of struggle against this nonsense yet have not thought up, that is why it is necessary to do{make} all foolishly. But will work. The table with a border thickness in one piksel:

<table width=200 border=0 cellpadding=1

cellspacing=0 bgcolor = * 000000>

<td>

<tr>

</tr>

</table>

</td>

</table>

As you can notice, the problem again is solved by means of the enclosed tables. In this case for the external table the black background and parameter cellpadding is set is established in unit at a zero border, i.e. that we see, actually not a border, and an edge of a background.

Any differences

In end of conversation on tables I shall formulate some rules which it is necessary to adhere during development of the design based on tabulared imposition.

1. Specify all the sizes long tables and cells making them.

Width and height should be rigidly set both for the table, and for cells which make her . To this principle to adhere from first day better. Believe on a word: when you impose more-less complex page even with ten - other of pictures, it is better to specify at once all the sizes long, differently then it is necessary for a long time and to creep tiresomely on a code, trying to define{determine}, what cell forces "to leave" all design. By the way, it concerns and to all pictures placed in the tables.

2. Whenever possible specify all the sizes long in pikselakh, instead of in percentage

If you use "rubber" design, from it corrected sometimes that is possible to recede, and only when you set, say, width of columns which in the sum should borrow{occupy} all screen. Remember, that at scaling the document or even at usual change of a window of a browser your percent{interests} can accept the most unexpected values, and the design will collapsed.

3. Use rasporki.

Ours liked the Netscape never misses opportunities to joke. If the designer creates a cell of the table, even sets its{her} sizes, but does not place there a content (or the content does not borrow{occupy} all cell), the Netscape counts itself have the right to act with the sizes of a cell as will like, and sometimes and at all "skhlopyvaet" her . To avoid this trouble, create a transparent picture of a format .gif in the size 1kh1 piksel and insert her into empty cells, specifying the corresponding size. Due to such "rasporke" tables will look how is conceived.

4. Specify zero thickness of a border for all pictures in the table.

If on any from pictures the link, and parameter border will appear is not nulled, around of a picture there will be a border due to what the design, certainly, again will collapsed.

6. Break off tegi.

If to put beside two pictures and to write teg img for each of them in a separate line, it will turn out that:

And because we have made all so:

Now we shall try to break off one of tegov:

<img src = "../second.img/bred.gif" width = "20" height=20> <img

src = "../second.img/bred.gif" width = "20" height=20>

In result it is received absolutely other picture:

And all because the browser perceives carry of a line and a blank equally: for him it whitespace, in the elementary case - a blank. He also puts a blank between two pictures.

At use of tabulared imposition a tiny mistake in a code carry of the line worth like there where he needs perhaps to force "to go" all composition. Mean.;-)