I'm using this layout to show you how I made it. It's a little like the other tutorial Simple Layer except that we added some more "lines" near the text.

Basically, we take the base coding of the other tutorial and then add something instead of the "Your text goes here":

We start with more tables. :) The first table is for the first thin sidebar, the one that goes higher than the other thing one. The width on this layout is set at 75% but you can put what you want depending on how wide you want the text section.

<table border="0" cellpadding="0" cellspacing="0" width="75%" background="sidebar.jpg">
<tr> <td width="100%">

 Another center tag.

<center>

Another table that will have the space between both line and a center tag.

<table border="0" cellpadding="5" cellspacing="0" width="99%" background="background.jpg">
<tr><td width="100%">
<center>

This tag is so that the 2 new sidebars aren't even in height.

<br>

Last sidebar before your text:

<table border="0" cellpadding="0" cellspacing="0" width="98%" background="sidebar.jpg">
<tr><td width="100%">

A center tag for the table containing your text.

<center>

<table border="0" cellpadding="5" cellspacing="0" width="99%" background="background.jpg">
<tr><td width="100%">

This will center your text, you can take it off or leave it depending on what you want to do.

<center> Now your text goes here :)

Now what goes after your text:

</td></tr></table></td></tr></table>
<br>
</td></tr></table></td></tr></table>

And then you continue with the rest of the code from the other tutorial.






Now the code without my notes:

<table border="0" cellpadding="0" cellspacing="0" width="75%" background="sidebar.jpg">
<tr> <td width="100%">

<center>

<table border="0" cellpadding="5" cellspacing="0" width="99%" background="background.jpg">
<tr><td width="100%">

<center>

<br>

<table border="0" cellpadding="0" cellspacing="0" width="98%" background="sidebar.jpg">

<tr><td width="100%">

<center>

<table border="0" cellpadding="5" cellspacing="0" width="99%" background="background.jpg">
<tr><td width="100%">

<center> Now your text goes here :)

</td></tr></table></td></tr></table>
<br>
</td></tr></table></td></tr></table>








You can also put some <br> tags and then start over with this new code so you could have another section with the same style.


Written on: 22nd of December, 2003


Home to Heavenspeace.com