layout examples

layout examples (next)

"I prefer showing you how to do, instead of doing it for you"
CraXoR

All these layout codes have been checked for the V2

N.B. : All these codes can be copied and pasted on your howrse page, or modified as you want !

But please, don't tell the other players that you made the layouts yourself... Learn how to share, not how to lie !

layout N°8

elements for the layout

background picture N°1

I took a basic picture, I added the titles, and made 2 zones for the rollboxes.
(using photoshop)
dimensions : 818 X 748

background picture N°2 for the second table

dimensions : 818 X 448
I took the same color as the bottom of the main picture, with a "dégradé", and added a title, and a zone for the big rollbox.

(using Photoshop)

border around the pictures

I have added a big table, inside which there are the 2 background pictures 1 and 2, and put a black border, width=1.

You can use the layout only with picture N°1

If you want to do that, delete the code corresponding to the second table, with picture N°2 in background.

html code

to copy this code, click inside the frame,
CTRL + C
and paste it in your html code frame : CTRL + V

 <center> <table align="center" border="1" bordercolor="#666666" cellpadding="0" cellspacing="0" width="820"> <tbody> <tr><td>  <table background="http://craxor.free.fr/crixorcluwb/images/jump.png" border="0" height="748" width="818"> <tbody> <tr> <td colspan="4" height="150"></td> </tr> <tr> <td height="202" width="32"></td> <td height="205" valign="top" width="202"><div style="overflow: auto; width: 202px; height: 202px;"><span style="color: rgb(0, 0, 0);"> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br><br> </span></div></td> <td height="202" width="410"></td> <td height="202"></td> </tr> <tr> <td colspan="4" height="112"></td> </tr> <tr> <td width="32"></td> <td colspan="2" height="240" width="616"><div style="overflow: auto; width: 616px; height: 240px;"><span style="color: rgb(0, 0, 0);"> <font size="3"><strong>My horses</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Reservations and offers:</strong></font><br> Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Stallions currently up for stud:</strong></font><br> <br> <b>Name </b><i> affix</i><br> GP: <br> BLUP: <br> Skills: <br> Fee: eq <br><br><br> <font size="3"><strong>Broodmares:</strong></font><br> <br> <b>Name </b><i> affix</i><br> GP: <br> BLUP: <br> Skills: <br><br><br> <font size="3"><strong>For Sale:</strong></font><br> <br> <b>Name </b><i> affix</i><br> <br> Breed : <br> GP: <br> BLUP: <br> Skills: <br> Price: 500eq and 1 Pass or 3500eq <br><br><br> </span></div></td> <td></td> </tr> <tr> <td colspan="4"></td> </tr> </tbody> </table>   <table background="http://craxor.free.fr/crixorcluwb/images/jump_footer.png" border="0" height="448" width="818"> <tbody> <tr> <td colspan="3" height="60"></td> </tr> <tr> <td height="350" width="32"></td> <td height="350" valign="top" width="750"><div style="overflow: auto; width: 750px; height: 325px;"><span style="color: rgb(0, 0, 0);"> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> </span></div></td> <td></td> </tr></tbody></table>   </td></tr></tbody></table> </center>

the result

html code : second table witth 2 rollboxes instead of one

to copy this code, click inside the frame,
CTRL + C
and paste it in your html code frame : CTRL + V

<center>  <table align="center" border="1" bordercolor="#666666" cellpadding="0" cellspacing="0" width="820"> <tbody> <tr><td>  <table background="http://craxor.free.fr/crixorcluwb/images/jump.png" border="0" height="748" width="818"> <tbody> <tr> <td colspan="4" height="150"></td> </tr> <tr> <td height="202" width="32"></td> <td height="205" valign="top" width="202"><div style="overflow: auto; width: 202px; height: 202px;"><span style="color: rgb(0, 0, 0);"> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br><br> </span></div></td> <td height="202" width="410"></td> <td height="202"></td> </tr> <tr> <td colspan="4" height="112"></td> </tr> <tr> <td width="32"></td> <td colspan="2" height="240" width="616"><div style="overflow: auto; width: 616px; height: 240px;"><span style="color: rgb(0, 0, 0);"> <font size="3"><strong>My horses</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Reservations and offers:</strong></font><br> Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Stallions currently up for stud:</strong></font><br> <br> <b>Name </b><i> affix</i><br> GP: <br> BLUP: <br> Skills: <br> Fee: eq <br><br><br> <font size="3"><strong>Broodmares:</strong></font><br> <br> <b>Name </b><i> affix</i><br> GP: <br> BLUP: <br> Skills: <br><br><br> <font size="3"><strong>For Sale:</strong></font><br> <br> <b>Name </b><i> affix</i><br> <br> Breed : <br> GP: <br> BLUP: <br> Skills: <br> Price: 500eq and 1 Pass or 3500eq <br><br><br> </span></div></td> <td></td> </tr> <tr> <td colspan="4"></td> </tr> </tbody> </table>   <table background="http://craxor.free.fr/crixorcluwb/images/jump_footer.png" border="0" height="448" width="818"> <tbody> <tr> <td colspan="5" height="60"></td> </tr> <tr> <td height="350" width="32"></td> <td height="350" valign="top" width="360"><div style="overflow: auto; width: 360px; height: 325px;"><span style="color: rgb(0, 0, 0);"> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> </span></div></td> <td height="350" width="20"></td> <td height="350" valign="top" width="360"><div style="overflow: auto; width: 360px; height: 325px;"><span style="color: rgb(0, 0, 0);"> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> Text text text text text text text text text text text text <br> <br> <b>date</b><br> Text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <font size="3"><strong>Title</strong></font><br>Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> </span></div></td> <td></td> </tr></tbody></table>   </td></tr></tbody></table> </center>

the result

layout N°9

elements for the layout

background picture

I took a basic picture, I added the title
(using photoshop)
dimensions : 820 X 500

rollboxes under the picture

there are 3 rollboxe codes, but the boxes become rollboxes only if you put enough text in them => on the result, you can see that the left box is not a rollbox, because the text is not long enough to make it roll.
You can change the background color of the boxes :
In the code, change the color codes :
Left box : bgcolor="#660000" => brown
Center box : bgcolor="#990000" => red
Right box : bgcolor="#C55401" => orange

html code

to copy this code, click inside the frame,
CTRL + C
and paste it in your html code frame : CTRL + V

<center> <table align="center" background="http://craxor.free.fr/crixorcluwb/images/alegreliberte.png" border="0" cellpadding="0" cellspacing="0" height="500" width="820"> <tbody><tr><td height="500"></td></tr></tbody></table> <table align="center" bgcolor="#020200" cellpadding="0" cellspacing="0" width="820"> <tbody><tr> <td rowspan="4" width="5"></td> <td rowspan="3" align="center" bgcolor="#660000" valign="top" width="270"><div style="overflow: auto; width: 260px; height: 600px;" align="center"> <h3><font color="#ffffcc" face="Papyrus">Welcome</font></h3> <br><span style="color: rgb(255, 255, 204);">Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text </span> <br><br><h3><font color="#ffffcc" face="Papyrus">My breeding farm</font></h3> <span style="color: rgb(255, 255, 204);">Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text </span> <br><br><h3><font color="#ffffcc" face="Papyrus">My Equestrian Center</font></h3> <span style="color: rgb(255, 255, 204);">Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text </span> </div></td> <td rowspan="2" align="center" bgcolor="#990000" valign="top" width="270"><div style="overflow: auto; width: 270px; height: 500px;" align="center"> <h3><font color="#ffffcc" face="Papyrus">My horses</font></h3> <span style="color: rgb(255, 255, 204);">Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <h3><font color="#ffffcc" face="Papyrus">Reservations and offers</font></h3> Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <br><br> <h3><font color="#ffffcc" face="Papyrus">Stallions up for stud</font></h3> <b>Name </b><i> affix</i><br> GP: <br> BLUP: <br> Skills: <br> Fee: eq <br><br><br> <h3><font color="#ffffcc" face="Papyrus">Broodmares</font></h3> <b>Name </b><i> affix</i><br> GP: <br> BLUP: <br> Skills: <br><br><br> <h3><font color="#ffffcc" face="Papyrus">For Sale</font></h3> <b>Name </b><i> affix</i><br> <br> Breed : <br> GP: <br> BLUP: <br> Skills: <br> Price: 500eq and 1 Pass or 3500eq <br><br><br> </span> </div></td> <td align="center" bgcolor="#c55401" height="400" valign="top" width="270"><div style="overflow: auto; width: 270px; height: 400px;" align="center"> <h3><font color="#ffffcc" face="Papyrus">News</font></h3> <span style="color: rgb(255, 255, 204);">Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text</span> <br><br><h3><font color="#ffffcc" face="Papyrus">Help</font></h3> <span style="color: rgb(255, 255, 204);">Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text</span> </div></td> <td rowspan="4" bgcolor="#020200" width="5"> </td> </tr> <tr> <td align="center" bgcolor="#020200" valign="top" width="270"> </td> </tr> <tr> <td colspan="2" align="center" bgcolor="#020200" height="100" valign="top"> </td> </tr> <tr> <td colspan="5" bgcolor="#020200" height="20"> </td> </tr> </tbody></table> </center>

the result

layout N°10 for EC page

elements for the layout

background picture

I took a basic picture, and I added the title
(using photoshop)
dimensions : 528 X 351

for the boxes

Box N°1 : simple box code
width=530 height depends on text in it
background color : bgcolor="#8b561c"
text color : <font color="#ffffff">

Box N°2 : simple box code
width=200 height depends on text in it
background color : bgcolor=#cdac7f"
title color : <font color="#9e3209"

Box N°3 : roll box code
width=330 height=300
background color : bgcolor=#f9e7d2"
title color : <font color="#9e3209"

Box N°4 : simple box code
width=530 height depends on text in it
background color : bgcolor=#502403"
text color : <font color="#ffffff">

color for the table

border surrounding the layout:
bordercolor="#957150"

use your own picture

keep the same dimensions : width=528 (because I put border=1)
host your picture and get an url, and replace in my code, after: background=

If your picture in higher than 351, you have to raise the height in the code for the first table and the first td (height="351")

html code

to copy this code, click inside the frame,
CTRL + C
and paste it in your html code frame : CTRL + V

<center> <table align="center" border="1" bordercolor="#957150" cellpadding="0" cellspacing="0" width="530"> <tbody><tr> <td colspan="2" background="http://craxor.free.fr/crixorcluwb/images/academie528.png" height="351" width="528"> </td> </tr> <tr> <td colspan="2" bgcolor="#8b561c"><div align="center"><br> <h3><font color="#ffffff" face="Papyrus">My Equestrian Center </font></h3> <font color="#ffffff"> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> </font> <br><br> </div></td> </tr> <tr> <td bgcolor="#cdac7f" valign="top" width="200"><div style="border: 0px none ; overflow: auto; float: left; margin-left: 10px; margin-right: 0px; width: 200px; height: 300px;"> <br> <h3><font color="#9e3209" face="Papyrus">News</font></h3> Text Text Text Text Text Text Text Text Text<br> Text <br> Text <br> Text <br> Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text <br> Text <br> Text <br> Text <br> Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text <br> Text <br> Text <br> </div></td> <td bgcolor="#f9e7d2" valign="top" width="330"><div style="border: 0px none ; overflow: auto; float: left; margin-left: 10px; margin-right: 0px; width: 330px; height: 300px;"> <br> <h3><font color="#9e3209" face="Papyrus">Boarding and Resident horses</font></h3> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text <br> Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br><br> <h3><font color="#9e3209" face="Papyrus">My Equestrian Center Tips</font></h3> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text <br> Text <br> Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> <br><br> </div></td> </tr> <tr> <td colspan="2" bgcolor="#502403"><div align="center"> <br> <h3><font color="#ffffff" face="Papyrus">More about me</font></h3> <font color="#ffffff"> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> </font> <br><br></div></td> </tr> </tbody></table> </center>

the result

same layout example, with other pictures

Arabians head background picture

In the top code of the layout, change the picture url and put:

http://craxor.free.fr/crixorcluwb/images/academie5282.png

Horse head background picture

In the top code of the layout, change the picture url and put:

http://craxor.free.fr/crixorcluwb/images/academie5283.png

layout N°11

elements for the layout

background picture

I took a basic picture, I added the title
(using photoshop)
dimensions : 800 X 520

rollboxes under the picture

there are 3 rollboxe codes, but the boxes become rollboxes only if you put enough text in them
You can change the background color of the boxes :
In the code, change the color codes :
bgcolor="#cccccc" => grey

html code

to copy this code, click inside the frame,
CTRL + C
and paste it in your html code frame : CTRL + V

<center> <table style="border-collapse: collapse;" align="center" border="3" bordercolor="#3e7301" width="806"> <tbody> <tr> <td align="center"><img src="http://craxor.free.fr/crixorcluwb/images/horsehead11.gif" height="520" vspace="5" width="800"></td></tr> <tr> <td valign="top"> <table border="0" height="550" width="780"> <tbody> <tr> <td colspan="2" bgcolor="#3e7301" valign="top"> </td> </tr> <tr> <td bgcolor="#cccccc" valign="top" width="390"> <div style="border: 0px solid black; padding: 10px; overflow: auto; width: 385px; height: 300px;"> <h3 align="left"><font face="Papyrus">News</font></h3> <span align="left"><font face="Arial" size="2">text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text <br>text <br>text <br>text <br>text <br>text <br>text <br>text <br>text <br></font></span><br><br> <h3 align="left"><font face="Papyrus">My Breeding partners</font></h3> <span align="left"><font face="Arial" size="2">- text <br>- text <br>- text <br>- text <br>- text <br>- text <br>- text <br>- text <br>- text <br>- text <br></font></span></div></td> <td bgcolor="#cccccc" valign="top" width="390"> <div style="border: 0px solid black; padding: 10px; overflow: auto; width: 385px; height: 300px;"><h3 align="left"><font face="Papyrus">My Horses</font></h3><span align="left"><font size="2"><font face="Arial">- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br></font></font></span><br><br><h3 align="left"><font face="Papyrus">Reservations and offers</font></h3><span align="left"><font size="2"><font face="Arial">- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br>- text text text text text text<br></font></font></span></div></td></tr> <tr> <td colspan="2" bgcolor="#3e7301" valign="top"> </td> </tr> <tr> <td colspan="2" bgcolor="#cccccc" valign="top"> <div style="border: 0px solid black; padding: 10px; overflow: auto; width: 790px; height: 250px;" align="center"><b><font face="Papyrus" size="4">My Breeding Farm</font></b><br> <span><font face="Arial" size="2">text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br></font></span> <br> <b><font face="Papyrus" size="4">More about me</font></b><br> <span><font face="Arial" size="2">text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br>text text text text text text text text text text text text text text text text text text text text text text text text text text text<br></font></span></div></td></tr> <tr> <td colspan="2" bgcolor="#3e7301"> </td> </tr> </tbody></table></td></tr></tbody></table> </center>

the result

layout N°12

elements for the layout

background picture

I took a basic picture
dimensions : 800 X 550

rollboxe ON the picture

No background color, text color = #ffffff = white

2 rollboxes under the picture

Table with background color = #8b7a5d
Left rollbox : background color = rgb(228, 213, 187);
Right rollbox : background color = #8b7a5d
Text color : #7c450c = brown and #ffffff = white

html code

to copy this code, click inside the frame,
CTRL + C
and paste it in your html code frame : CTRL + V

<center><table style="border-collapse: collapse;" align="center" border="2" bordercolor="#7c450c" cellpadding="0" cellspacing="0" width="800"><tbody><tr><td> <table align="center" background="http://craxor.free.fr/crixorcluwb/images/stablehorse.gif" border="0" cellpadding="0" cellspacing="0" width="100%"> <tbody> <tr> <td height="550" width="426"></td> <td valign="top" width="374"><div style="border: 0px solid rgb(124, 69, 12); padding: 5px; overflow: auto; width: 365px; height: 536px;"><span><font color="#ffffff" face="Arial" size="6"><br><b>My Breeding Farm</b></font><br><br><font color="#ffffff" face="Arial" size="2"><b>Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla</b></font><br><font color="#ffffff" face="Arial" size="6"><br><b>My Horses</b></font><br><br><font color="#ffffff" face="Arial" size="2"><b>Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla</b></font><br><font color="#ffffff" face="Arial" size="6"><br><b>Reservations</b></font><br><br><font color="#ffffff" face="Arial" size="2"><b>Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla</b></font><br><br><font color="#ffffff" face="Arial" size="6"><b>More about me</b></font><br><br><font color="#ffffff" face="Arial" size="2"><b>Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla</b></font></span></div></td> <td width="2"></td> </tr> </tbody></table> <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%"> <tbody> <tr> <td colspan="3" bgcolor="#8b7a5d" height="10" width="100%"> </td></tr> <tr> <td bgcolor="#8b7a5d" width="12"> </td> <td width="393"> <div style="padding: 5px; overflow: auto; width: 383px; height: 290px; visibility: visible; background-color: rgb(228, 213, 187);"><span><font color="#7c450c" face="Arial" size="5"><b><em>~ My breeding partners ~</em></b></font><br> <div style="padding: 20px;" align="left"> <font color="#7c450c" face="Arial" size="2"> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br> <br><br> </font></div> </span></div> </td> <td width="391"> <div style="padding: 5px; overflow: auto; width: 381px; height: 290px; visibility: visible; background-color: rgb(139, 122, 93);"><span><font color="#ffffff" face="Arial" size="5"><b><em>~ News ~</em></b></font><div style="padding: 20px;" align="left"> <font color="#ffffff" face="Arial" size="2"><b>date : 08/02/28</b><br> text text text text text text text text text text text text text text text <br><br> <b>date : 08/02/29</b><br> text text text text text text text text text text <br> text text text text text text text text text text text text text text text <br> text text text text text text text text text text <br><br> <b>date : 08/03/01</b><br> text text text text text text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text <br><br> <b>date : 08/03/10</b><br> text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text <br> text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text <br> text text text text text text text text text text <br> text text text text text <br><br> <b>date : 08/03/30</b><br> text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text <br> text text text text text text text text text text <br> </font> <b><br><br> </b></div> </span></div> </td> </tr> <tr> </tr><tr> <td colspan="3" bgcolor="#8b7a5d" height="10" width="100%"> </td></tr> <tr> </tr></tbody> </table> </td> </tr> </tbody> </table></center>

the result

layout N°13

elements for the basic layout

picture

I took a basic picture - dimensions : 340 X 550
cell for the picture : width = 426

background

dimensions : 802 X 590
background color= #3c6800
bordercolor: #d70000 = red - border=2px

rollboxe besides the picture (here on the right)

cell for the rollbox : width = 374
text color : #ffffff = white and #f5f9a0 = yellow

changing the picture

change some dimensions if you change the picture dimensions :
background height = picture height + 40
max picture width = 400 (horizontal picture hspace= min 13)
rollbox: height = picture height - 10 - width = 365

background color : #3c6800

html code

the result

picture : dimensions : 340 X 550

background height = 590
max hspace= (426 - 340) / 2 = 43
rollbox: height = 540 - width = 365

other result : wider picture

picture : dimensions : 398 X 530

background height = 570

max hspace= (426 - 398) / 2 = 14
rollbox: height = 520 - width = 365

background color : #8a2a14

layout N°13 b

adding elements to the basic layout

second table with 2 rollboxes

left rollbox - dimensions : 342 X 286
right rollbox - dimensions : 341 X 290
cell in between the 2 rollboxes - width : 65

background color : rgb(60, 104, 0)
background color : rgb(245, 249, 160)

html code

the result

layout N°13 c

adding elements to the basic layout

third table with 3 rollboxes

left margin = 30 (= horizontal picture margin)
left rollbox - dimensions : 243 X 286
center rollbox - dimensions : 244 X 286
right rollbox - dimensions : 243 X 286

background color : rgb(60, 104, 0)
background color : rgb(245, 249, 160)

html code

to copy this code, click inside the frame,
CTRL + C
and paste it in your html code frame : CTRL + V

<center> <table align="center" bgcolor="#ffffff" border="2" bordercolor="#d70000" cellpadding="0" cellspacing="0" width="806"> <tbody><tr> <td> <table align="center" bgcolor="#3c6800" border="0" cellpadding="0" cellspacing="0" height="590" width="802"> <tbody> <tr> <td colspan="2" bgcolor="#3c6800" height="20" width="100%"> </td></tr> <tr> <td align="center" bgcolor="#3c6800" valign="top" width="426"><img src="http://craxor.free.fr/crixorcluwb/images/warmblood.gif" bordercolor="#000000" border="2" hspace="30"></td> <td valign="top" bgcolor="#3c6800" width="376"><div style="border: 0px solid rgb(124, 69, 12); padding: 5px; overflow: auto; width: 366px; height: 540px;"><span><font color="#ffffff" face="Arial" size="4"><br><b>~ My Breeding Farm ~</b></font><br><br><font color="#ffffff" face="Arial" size="2">Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla</font><br><br><font color="#ffffff" face="Arial" size="4"><b>~ My Horses ~</b></font><br><br><font color="#ffffff" face="Arial" size="2"><b>- Bla bla bla bla bla bla <br>- Bla bla bla bla bla bla <br>- Bla bla bla bla bla bla <br>- Bla bla bla bla bla bla <br>- Bla bla bla bla bla bla <br>- Bla bla bla bla bla bla <br></b></font><br><font color="#f5f9a0" face="Arial" size="4"><b>~ Reservations ~ </b></font><br><br><font color="#f5f9a0" face="Arial" size="2">Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla </font><br><br><font color="#f5f9a0" face="Arial" size="4"><b>~ More about me ~</b></font><br><br><font color="#f5f9a0" face="Arial" size="2">Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla Bla bla bla bla bla bla bla bla bla bla</font></span></div></td> <td width="2"></td> </tr> </tbody></table> <table align="center" border="0" cellpadding="0" cellspacing="0" width="802"> <tbody> <tr> <td colspan="4" bgcolor="#3c6800" height="10" width="100%"></td> </tr> <tr> <td bgcolor="#3c6800" width="30"> </td> <td width="356"> <div style="border: 2px solid rgb(0, 0, 0); padding: 5px; overflow: auto; width: 342px; height: 286px; background-color: rgb(245, 249, 160);"><span><font color="#3c6800" face="Arial" size="5"><b><em>~ My breeding partners ~</em></b></font><br> <div style="padding: 20px;" align="left"> <font color="#3c6800" face="Arial" size="2"> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br> <br><br> </font></div> </span></div> </td> <td bgcolor="#3c6800" width="65"></td> <td width="351"> <div style="padding: 5px; overflow: auto; width: 341px; height: 290px; background-color: rgb(60, 104, 0);"><span><font color="#ffffff" face="Arial" size="5"><b><em>~ News ~</em></b></font><div style="padding: 20px;" align="left"> <font color="#ffffff" face="Arial" size="2"><b>date : 08/02/28</b><br> text text text text text text text text text text text text text text text <br><br> <b>date : 08/02/29</b><br> text text text text text text text text text text <br> text text text text text text text text text text text text text text text <br> text text text text text text text text text text <br><br> <b>date : 08/03/01</b><br> text text text text text text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text <br><br> <b>date : 08/03/10</b><br> text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text <br> text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text <br> text text text text text text text text text text <br> text text text text text <br><br> <b>date : 08/03/30</b><br> text text text text text text text text text text <br> text text text text text text text text text text <br> text text text text text <br> text text text text text text text text text text <br> </font> <b><br><br> </b></div> </span></div> </td> </tr> <tr> <td colspan="4" bgcolor="#3c6800" height="10" width="100%"></td></tr> </tbody></table> <table align="center" border="0" cellpadding="0" cellspacing="0" width="802"> <tbody> <tr> <td colspan="4" bgcolor="#3c6800" height="10" width="100%"> </td></tr> <tr> <td bgcolor="#3c6800" width="30"> </td> <td width="257"> <div style="border: 2px solid rgb(0, 0, 0); padding: 5px; overflow: auto; width: 243px; height: 286px; background-color: rgb(245, 249, 160);"><span><font color="#a80000" face="Arial" size="4"><b><em>~ Another Title ~</em></b></font><br> <div style="padding: 20px;" align="left"> <font color="#3c6800" face="Arial" size="2"> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br> <br><br> </font></div> </span></div> </td> <td width="258"> <div style="border: 2px solid rgb(0, 0, 0); padding: 5px; overflow: auto; width: 244px; height: 286px; visibility: visible; background-color: rgb(245, 249, 160);"><span><font color="#a80000" face="Arial" size="4"><b><em>~ Another Title ~</em></b></font><br> <div style="padding: 20px;" align="left"> <font color="#3c6800" face="Arial" size="2"> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br> <br><br> </font></div> </span></div> </td> <td width="257"> <div style="border: 2px solid rgb(0, 0, 0); padding: 5px; overflow: auto; width: 243px; height: 286px; visibility: visible; background-color: rgb(245, 249, 160);"><span><font color="#a80000" face="Arial" size="4"><b><em>~ Another Title ~</em></b></font><br> <div style="padding: 20px;" align="left"> <font color="#3c6800" face="Arial" size="2"> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br><br> text text text text text text text text text text <br> <br> <br><br> </font></div> </span></div> </td> </tr> <tr> <td colspan="4" bgcolor="#3c6800" height="10" width="100%"></td></tr> </tbody></table> </td></tr> </tbody></table> </center>

the result

layout N°14

elements for the layout

top picture

dimensions : 820 X 549

top picture url :
- basic without anything :
http://craxor.free.fr/crixorcluwb/images/hordechevaux.gif

- with borders + center background:
http://craxor.free.fr/crixorcluwb/images/hordechevaux01a.gif

- with borders + center background + bottom title:
http://craxor.free.fr/crixorcluwb/images/hordechevaux01b.gif

With photoshop, or another picture program, you ca make a few modifications on the picture :

- Add titles

- Create a border on the left and on the right,
here I made a border with background color = #110a04, and width=30

- Create a center background,
here I made an area with a blurred effect on top, with background color = #d5b687, and width = 760

- the background colors will be used in the second part of the layout, for the border columns and center column, so it's important to note them carefully.

bottom picture

dimensions : 820 X 30
- Same background color as the borders in the top picture,
background color = #110a04

bottom picture url :
- basic without anything :
http://craxor.free.fr/crixorcluwb/images/hordechevaux02a.gif

You can write your copyright for example on this picture

background 1 color: rgb(17, 10, 4) = #110a04
background 2 color : rgb(213, 182, 135) = #d5b687

html code : basic layout

the result

html code : layout with 4 boxes

to copy this code, select the code inside the frame,
CTRL + C
and paste it in your html code frame : CTRL + V

<center> <table style="border-collapse: collapse;" align="center" border="3" bordercolor="#110a04" cellpadding="0" cellspacing="0"> <tbody> <tr><td>  <table align="center" border="0" cellpadding="0" cellspacing="0" width="820"><tbody><tr> <td colspan="4"><div align="center"><img src="http://craxor.free.fr/crixorcluwb/images/hordechevaux01b.gif" height="549" width="820"></div></td></tr> <tr> <td bgcolor="#110a04" width="30"> </td> <td colspan="2" bgcolor="#d5b687" width="760"><div align="center"><br> <h3><font color="#ffffff" face="Papyrus">All about my breeds </font></h3> <font color="#ffffff"> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<br> </font> <br><br></div></td> <td bgcolor="#110a04" width="30"> </td> </tr> <tr> <td bgcolor="#110a04" valign="top" width="30"> </td> <td colspan="2" bgcolor="#d5b687" valign="top" width="760"> </td> <td bgcolor="#110a04" valign="top" width="30"> </td> </tr> <tr> <td bgcolor="#110a04" width="30"> </td> <td bgcolor="#d5b687" valign="top" width="300"><div style="border: 0px none ; padding: 10px; float: left;"> <br> <h3><font color="#9e3209" face="Papyrus">News</font></h3> Text Text Text Text Text Text Text Text Text<br> Text <br> Text <br> Text <br> Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text <br> Text <br> Text <br> Text <br> Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text <br> Text <br> Text <br> </div></td> <td bordercolor="#7c450c" bgcolor="#f9e7d2" valign="top" width="460"><div style="border: 1px solid rgb(255, 255, 255); padding: 10px; overflow: auto; float: left; width: 438px; height: 300px;"> <br> <h3><font color="#9e3209" face="Papyrus">My Stallions and Broodmares</font></h3> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text <br> Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br><br> <h3><font color="#9e3209" face="Papyrus">My services</font></h3> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text <br> Text <br> Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> <br><br> </div></td> <td bgcolor="#110a04" width="30"> </td> </tr> <tr> <td bgcolor="#110a04" width="30"> </td> <td colspan="2" bgcolor="#d5b687" width="760"><div align="center"> <br> <h3><font color="#ffffff" face="Papyrus">More about me</font></h3> <font color="#ffffff"> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text <br> </font> <br><br></div></td> <td bgcolor="#110a04" width="30"> </td> </tr> <tr><td colspan="4"><div align="center"><img src="http://craxor.free.fr/crixorcluwb/images/hordechevaux02.gif" width="820"></div></td></tr> </tbody></table> </td></tr> </tbody></table> </center>

layout examples (next)

layout N°8

elements for the layout

html code

the result

html code : second table witth 2 rollboxes instead of one

the result

layout N°9

elements for the layout

html code

the result

layout N°10 for EC page

elements for the layout

html code

the result

same layout example, with other pictures

layout N°11

elements for the layout

html code

the result

layout N°12

elements for the layout

html code

the result

layout N°13

elements for the basic layout

html code

the result

other result : wider picture

layout N°13 b

adding elements to the basic layout

html code

the result

layout N°13 c

adding elements to the basic layout

html code

the result

layout N°14

elements for the layout

html code : basic layout

the result

html code : layout with 4 boxes

the result

you want more ?

good links

and...

sponsored links