Shaker Style Wall Colours

achieve a mosaic links

Create a mosaic of links

Create a mosaic Image

Create Table

Title

It is very easy to add links as a mosaic above in HTML / JavaScript a message or an HTML / JavaScript widget.

Just create a table:

1) place the code in the image and its link (circled by \u0026lt;a> and \u0026lt;/ a>) between \u0026lt;td> and \u0026lt; / td>;

2) reduce the size of the image: in the example above: / s200 / became / s60 /;

3) place the title and each row of images between and the \u0026lt;tr> \u0026lt;/ tr>;

4) place it between the \u0026lt;table> and \u0026lt;/ table>;

5) put the table between the \u0026lt;div style = margin -left: 130px; line-height: 8px "> and \u0026lt;/ div> to shift to the right and reduce the space between lines;

6) put the title between the \u0026lt;span style = margin-left: 10px; line-height: 14px "> and \u0026lt;/ span> to shift to the right and set the row height.

* * * * * To create

a mosaic of images that are not links, just apply the method described above (creating a table) by omitting the links, or what is contained in the \u0026lt;a .. ......> and \u0026lt;/ a>.

can also use a gadget that automatically retrieves all the images from a Picasa album:
http://viti-vino.blogspot.com/2011/01/gadget-blogger-vignettes-picasa.html

* * * * *

can also create a table with links identified by words instead of images.

can finally create a picture with words that are not links.

A framework has been added in the example below and the code that appears right after. This code is used to avoid changing the "Model" - "TEMPLATE" THE BLOG. "Border-collapse: collapse;" remove the spaces between cells of the table. In the final code, all instructions must be contiguous to avoid line breaks and blank lines.

Title 1 Title 2		Title 3 Title 4
	data 1.1 Data 2.1.	Donnée 3.1	Donnée 4.1
Donnée 1.2	Donnée 2.2	Donnée 3.2	Donnée 4.2
Donnée 1.3	Donnée 2.3	Donnée 3.3	Donnée 4.3

<style>.tableautable {border-collapse: collapse;}.tableauth{border: 1px solid black;padding:5px;}
</style><div style=margin-left:80px;>
<table class="tableautable">
<tr>
<th class = "tableauth"> Heading 1 \u0026lt;/ th> \u0026lt;th
class="tableauth"> Title 2 \u0026lt;/ th> \u0026lt;th
class="tableauth"> Title 3 \u0026lt;/ th>
\u0026lt; th class = "tableauth"> Title 4 \u0026lt;/ th>
\u0026lt;/ tr>
\u0026lt;tr>
\u0026lt;th class="tableauth"> Data 1.1 \u0026lt;/ th>
\u0026lt;th class = " tableauth "> Data 2.1 \u0026lt;/ th> \u0026lt;th
class="tableauth"> Data 3.1 \u0026lt;/ th>
\u0026lt;th class="tableauth"> Data 4.1 \u0026lt;/ th>
\u0026lt;/ tr>
\u0026lt;tr>
\u0026lt;th class="tableauth"> Data 1.2 \u0026lt;/ th>
\u0026lt; th class = "tableauth"> Data 2.2 \u0026lt;/ th> \u0026lt;th
class="tableauth"> data 3.2 \u0026lt;/ th> \u0026lt;th
class="tableauth"> Data 4.2 \u0026lt;/ th> ;
\u0026lt;/ tr>
\u0026lt;tr>
\u0026lt;th class="tableauth"> Data 1.3 \u0026lt;/ th>
\u0026lt;th class="tableauth"> Data 2.3 \u0026lt;/ th> \u0026lt;th
class="tableauth"> Data 3.3 \u0026lt;/ th> \u0026lt;th
class="tableauth"> Data 4.3 \u0026lt; ; / th>
\u0026lt;/ tr>
\u0026lt;/ table> \u0026lt;/ div>