spacer
EBIEBI Style TemplatesStatic Style TemplatesEdit/Add Centre ContentEdit/Add Tables

Static html Template - Edit/Add Tables

If you are using a fixed width template the main body section has a width of 645px.

In the source code of your template look for the following comment tags:

<!-- start contents here -->

Paste your main body content html source code in between these comment tags

<!-- end contents here -->


Example Fixed Width Table

The following is an example of a fixed width table you could add to your page.

Heading No Link - Center
Heading With Link - Center
Heading No Link - Left
Heading With Link - Left
Heading No Link - Right
Heading With Link - Right
Sub Heading No Link - Center
Sub Heading With Link - Center
Sub Heading No Link - Left
Sub Heading With Link - Left
Sub Heading No Link - Right
Sub Heading With Link - Right
Input Box:
Input Box (Full Width):
Text Area Box:
Text Area Box (Full Width):
Select Drop Down:
Select Drop Down (Full Width):
Radio Buttons: Option1 Option2 Option3 Option4 Option5
Check Boxes: Option1 Option2 Option3 Option4 Option5
Right Aligned Text: Right Aligned Text
Center Aligned Text: Center Aligned Text
Alternate Row Colour: Alternate Row Colour
Alternate Row Colour: Alternate Row Colour
Alternate Row Colour: Alternate Row Colour
Alternate Row Colour: Alternate Row Colour



To add this fixed width table to your page select the following html source code and paste in between the comments tags (see above) in your template. An explanation of the styles used is given below.


Select All


Fixed Width Table Style's Explanation

<table class="contenttable_lmenu">
This styles the general table.



<th colspan="2">Heading No Link - Center</th>
This sets the style for the table header with no link, text in center aligned.

<th colspan="2"><a href="#" class="offwhite">Heading With Link - Center</a></th>
This sets the style for the table header with a link, text is center aligned.

<th colspan="2" class="headingleft">Heading No Link - Left</th>
This sets the style for the table header with no link, text is left aligned.

<th colspan="2" class="headingleft"><a href="#" class="offwhite">Heading With Link - Left</a></th>
This sets the style for the table header with a link, text is left aligned.

<th colspan="2" class="headingright">Heading No Link - Right</th>
This sets the style for the table header with no link, text is right aligned.

<th colspan="2" class="headingright"><a href="#" class="offwhite">Heading With Link - Right</a></th>
This sets the style for the table header with a link, text is right aligned.



<td colspan="2" class="subheading">Sub Heading No Link - Center</td>
This sets the style for the table sub headings with no link, text is center aligned.

<td colspan="2" class="subheading"><a href="#">Sub Heading With Link - Center</a></td>
This sets the style for the table sub headings with a link, text is center aligned.

<td colspan="2" class="subheadingleft">Sub Heading No Link - Left</td>
This sets the style for the table sub headings with no link, text is left aligned.

<td colspan="2" class="subheadingleft"><a href="#">Sub Heading With Link - Left</a></td>
This sets the style for the table sub headings with a link, text is left aligned.

<td colspan="2" class="subheadingright">Sub Heading No Link - Right</td>
This sets the style for the table sub headings with no link, text is right aligned.

<td colspan="2" class="subheadingright"><a href="#">Sub Heading With Link - Right</a></td>
This sets the style for the table sub headings with a link, text is right aligned.



<td class="leftsubheading">Input Box:</td>
This sets the style for the left column sub headings.

<td><input name="input2" type="text" size="24"
class="contenttable_lmenu_input" /></td>
This sets the input box to a 100% width.

<td><textarea name="textbox" cols="24" rows="8"
class="contenttable_lmenu_input"></textarea></td>
This sets the text area box to a 100% width.

<td><select name="select1" class="contenttable_lmenu_select">
This sets the select drop down to a 100% width.

<td class="tdright">
This right aligns text in a td.

<td class="tdcenter">
This center aligns text in a td.

<tr class="alternaterowcolour">
This sets an alternate background colour for a row.

<script type="text/javascript"> tableruler(); </script>
This calls the row hover function (tableruler) which changes the background colour on row hover.

Top

Automatically add stripes and row hover to tables

  • Use one of the standard classes for content tables, e.g. "contenttable", "contenttable_lmenu", "contenttable_max".
  • Add this script after the table: 
          <script type="text/javascript">
              tablestriper();
              tableruler();				
          </script>

Top

Automatically table cell hovers to tables

Now add some more Centre content to the templates: spacer
spacer