Tiki Tour the Tiki Wiki

In a perfect world we would write one HTML document (template) and have one style sheet (CSS) that would render our glorious web pages in all types of web browsers but alias this is not the case.

Not pitching blame at anyone in particular but if you attempt to center your TikiWiki website using CSS you will probably find that Gecko-based browsers (e.g. Firefox) will easily obey your CSS while Internet Explorer will not.

Now you can center your web page quite easily for Gecko-based browsers by including the following CSS properties and values to the body section of your HTML document to give you a 10% left and right margin

Body{
margin: auto;
width: 80%;	
}

However when you view this in dumb Internet Explorer the page will NOT be centered. You may attempt the following as suggested by some authors which works sometimes

Body{
text-align: center;
margin: auto;
width: 80%;	
}

After mucking with these CSS properties for a while and getting spurious results you may decide that it’s just not worth it. But never fear there is a hack we can apply here.

There is an important CSS rule of precedence to understand here before we proceed. Without getting into all the intricate details of CSS cascading, and inheritance we can apply a general rule of thumb.

“The close a CSS property is to an HTML object the higher its precedence�

The following example illustrates this:

<div align="right">
<p align="left">
This text will align to the left
</p>
</div>

Now for the trick which breaks all the style rules– in the tiki.tpl doc add the following div tags to contain all the script on the page and inexplicably all will be centered for all browsers

<div style="text-align: center;">
  	<div style= "text-align: left; margin: auto; width: 80%;">

<<existing template page script..
{include file="header.tpl"}
{* Index we display a wiki page here *}
…
{include file="footer.tpl"}>>

</div>
</div>

Now this trick will raise some valid questions like why do we have to reset the left alignment at this level?

Good night and good luck