Basics
When making a style, you must already have in your mind what colours you want to use, and all the basic things of how you want it to look. One of the most important things is this: on which style is it going to be based, prosilver or subsilver2? Maybe you want to make a complete new style but that is really difficult. PLEASE BACKUP YOUR FILES BEFORE EDITTING THEM.
Then you need some really good HTML, CSS and Image Editting knowledge, in order to make a very special style.
Changing images is not really hard, and you barely need coding for that. The best way of making a style is beginning with a complete empty phpBB board.
Now you follow this route:
Administrator Control Panel >> Styles
This is the main section from which you are going to edit your styles.
••••Please be careful, ACP edits are not as good as edits in the actual files. The best way to edit your files is to download them
from your directory, edit them and reupload them. Then you should purge your cache, refresh and the change is there.
But for now we will be using the ACP, since that is the easiest way to start with.••••
On the left you will see a menu that has 4 links:
•Styles, •Template, •Theme, •Imageset
You probably wont need the Imageset link, but maybe you want to change something there too.
On the right you will see a table with all the style that are installed, and the ones that aren’t installed.
Now, on the left menu, click the template link. Now you will see the same table on the right, only it has one more link added after every style. The edit link.
Click it. Now you can select a HTML from all the HTML files the style is using. Here you can edit the HTML coding of your style. PLEASE BACKUP YOUR FILES BEFORE EDITTING THEM.
Now click on the Theme link in the left menu. Now there is one file in there. That is the stylesheet. This is the file you will be editing most parts of, so please back it up before editing.
You will see a huge amount of classes, that all have their own piece of code.
All those classes are used somewhere in the style.
--------------------------------------------------------------------------------------------------------------------
Images
When you look at your standard prosilver style you will see a certain amount of images.
Those images might suit you, but they might also not.
There is a very easy way to edit an image, which will take no longer then 10 minutes.
When you have found an image that doesnt suit you, right click on it.
Now click: Show Picture, or Show Background Image
In both cases, this will give you a link in your Browser Navigation Bar.
Which will look, on for instance, the header image, like this:
Now pick this part out: styles/prosilver/theme/images/bg_header.jpg
you see that the image you tried to look, is located in the images map.
Now open your directory, and simply find the file.
Now you can replace it with any file you like.
--------------------------------------------------------------------------------------------------------------------
CSS
What is CSS?
CSS is designed into 3 items: selector {property: value;}
The selector is normally the HTML element/tag you wish to define, the property is the attribute you wish to change, and each property can take a value. The property and value are separated by a colon, and surrounded by curly braces, and after the last value of a property the semicolon ; is needed in order to close the current property. If the value is multiple words, put quotes around the value.
--------------------------------------------------------------------------------------------------------------------
Classes
Finding the right class to edit can be really hard. Especially with phpBB, because all classes have multiple subclasses.
When you need a class, you first need to look what it is you want to change. Is it a color from a link or a header text, or something else?
when you want to change something that has to do with a link it always has the character: a in it.
Mozilla Firefox has several very usefull add-ons, that are easy to install, and have the good css class found within 1 second for you.
The only thing you have to do next is editting it in the stylesheet.css:
1.: http://chrispederick.com/work/web-developer/ - Web Developer
2.: http://www.getfirebug.com/ - Firebug
When editting a class its very important to remember what you edit, or at least save a backup.
--------------------------------------------------------------------------------------------------------------------
Styling in General
from phpbb.com
Templates should be produced in a consistent manner. Where appropriate they should be based off an existing copy, e.g. index, viewforum or viewtopic (the combination of which implement a range of conditional and variable forms). Please also note that the intendation and coding guidelines also apply to templates where possible.
The outer table class forumline has gone and is replaced with tablebg.
When writing <table> the order <table class="" cellspacing="" cellpadding="" border="" align=""> creates consistency and allows everyone to easily see which table produces which "look". The same applies to most other tags for which additional parameters can be set, consistency is the major aim here.
Each block level element should be indented by one tab, same for tabular elements, e.g. <tr> <td> etc., whereby the intendiation of <table> and the following/ending <tr> should be on the same line. This applies not to div elements of course.
Don't use <span> more than is essential ... the CSS is such that text sizes are dependent on the parent class. So writing <span class="gensmall"><span class="gensmall">TEST</span></span> will result in very very small text. Similarly don't use span at all if another element can contain the class definition, e.g.
<td><span class="gensmall">TEST</span></td>
can just as well become:
<td class="gensmall">TEST</td>
Try to match text class types with existing useage, e.g. don't use the nav class where viewtopic uses gensmall for example.
Row colours/classes are now defined by the template, use an IF S_ROW_COUNT switch, see viewtopic or viewforum for an example.
Remember block level ordering is important ... while not all pages validate as XHTML 1.0 Strict compliant it is something we're trying to work too.
Use a standard cellpadding of 2 and cellspacing of 0 on outer tables. Inner tables can vary from 0 to 3 or even 4 depending on the need.
Use div container/css for styling and table for data representation.
The separate catXXXX and thXXX classes are gone. When defining a header cell just use <th> rather than <th class="thHead"> etc. Similarly for cat, don't use <td class="catLeft"> use <td class="cat"> etc.
Try to retain consistency of basic layout and class useage, i.e. _EXPLAIN text should generally be placed below the title it explains, e.g. {L_POST_USERNAME}<br /><span class="gensmall">{L_POST_USERNAME_EXPLAIN}</span> is the typical way of handling this ... there may be exceptions and this isn't a hard and fast rule.
Try to keep template conditional and other statements tabbed in line with the block to which they refer.
this is correct
this is also correct:
it gives immediate feedback on exactly what is looping - decide which way to use based on the readability.
--------------------------------------------------------------------------------------------------------------------
d/m/y
19/4/2009 - Victim_ - Revised
12/03/2012 - Victim_ - Re-formatted
When making a style, you must already have in your mind what colours you want to use, and all the basic things of how you want it to look. One of the most important things is this: on which style is it going to be based, prosilver or subsilver2? Maybe you want to make a complete new style but that is really difficult. PLEASE BACKUP YOUR FILES BEFORE EDITTING THEM.
Then you need some really good HTML, CSS and Image Editting knowledge, in order to make a very special style.
Changing images is not really hard, and you barely need coding for that. The best way of making a style is beginning with a complete empty phpBB board.
Now you follow this route:
Administrator Control Panel >> Styles
This is the main section from which you are going to edit your styles.
••••Please be careful, ACP edits are not as good as edits in the actual files. The best way to edit your files is to download them
from your directory, edit them and reupload them. Then you should purge your cache, refresh and the change is there.
But for now we will be using the ACP, since that is the easiest way to start with.••••
On the left you will see a menu that has 4 links:
•Styles, •Template, •Theme, •Imageset
You probably wont need the Imageset link, but maybe you want to change something there too.
On the right you will see a table with all the style that are installed, and the ones that aren’t installed.
Now, on the left menu, click the template link. Now you will see the same table on the right, only it has one more link added after every style. The edit link.
Click it. Now you can select a HTML from all the HTML files the style is using. Here you can edit the HTML coding of your style. PLEASE BACKUP YOUR FILES BEFORE EDITTING THEM.
Now click on the Theme link in the left menu. Now there is one file in there. That is the stylesheet. This is the file you will be editing most parts of, so please back it up before editing.
You will see a huge amount of classes, that all have their own piece of code.
All those classes are used somewhere in the style.
--------------------------------------------------------------------------------------------------------------------
Images
When you look at your standard prosilver style you will see a certain amount of images.
Those images might suit you, but they might also not.
There is a very easy way to edit an image, which will take no longer then 10 minutes.
When you have found an image that doesnt suit you, right click on it.
Now click: Show Picture, or Show Background Image
In both cases, this will give you a link in your Browser Navigation Bar.
Which will look, on for instance, the header image, like this:
Code:
http://www.yoursite.com/forum/styles/prosilver/theme/images/bg_header.jpgyou see that the image you tried to look, is located in the images map.
Now open your directory, and simply find the file.
Now you can replace it with any file you like.
--------------------------------------------------------------------------------------------------------------------
CSS
What is CSS?
- CSS stands for Cascading Style Sheets
- Styles define how to display HTML elements
- Styles are normally stored in Style Sheets
- Styles were added to HTML 4.0 to solve a problem
- External Style Sheets can save you a lot of work
- External Style Sheets are stored in CSS files
- Multiple style definitions will cascade into one
CSS is designed into 3 items: selector {property: value;}
The selector is normally the HTML element/tag you wish to define, the property is the attribute you wish to change, and each property can take a value. The property and value are separated by a colon, and surrounded by curly braces, and after the last value of a property the semicolon ; is needed in order to close the current property. If the value is multiple words, put quotes around the value.
--------------------------------------------------------------------------------------------------------------------
Classes
Finding the right class to edit can be really hard. Especially with phpBB, because all classes have multiple subclasses.
When you need a class, you first need to look what it is you want to change. Is it a color from a link or a header text, or something else?
when you want to change something that has to do with a link it always has the character: a in it.
Mozilla Firefox has several very usefull add-ons, that are easy to install, and have the good css class found within 1 second for you.
The only thing you have to do next is editting it in the stylesheet.css:
1.: http://chrispederick.com/work/web-developer/ - Web Developer
2.: http://www.getfirebug.com/ - Firebug
When editting a class its very important to remember what you edit, or at least save a backup.
--------------------------------------------------------------------------------------------------------------------
Styling in General
from phpbb.com
Templates should be produced in a consistent manner. Where appropriate they should be based off an existing copy, e.g. index, viewforum or viewtopic (the combination of which implement a range of conditional and variable forms). Please also note that the intendation and coding guidelines also apply to templates where possible.
The outer table class forumline has gone and is replaced with tablebg.
When writing <table> the order <table class="" cellspacing="" cellpadding="" border="" align=""> creates consistency and allows everyone to easily see which table produces which "look". The same applies to most other tags for which additional parameters can be set, consistency is the major aim here.
Each block level element should be indented by one tab, same for tabular elements, e.g. <tr> <td> etc., whereby the intendiation of <table> and the following/ending <tr> should be on the same line. This applies not to div elements of course.
Don't use <span> more than is essential ... the CSS is such that text sizes are dependent on the parent class. So writing <span class="gensmall"><span class="gensmall">TEST</span></span> will result in very very small text. Similarly don't use span at all if another element can contain the class definition, e.g.
<td><span class="gensmall">TEST</span></td>
can just as well become:
<td class="gensmall">TEST</td>
Try to match text class types with existing useage, e.g. don't use the nav class where viewtopic uses gensmall for example.
Row colours/classes are now defined by the template, use an IF S_ROW_COUNT switch, see viewtopic or viewforum for an example.
Remember block level ordering is important ... while not all pages validate as XHTML 1.0 Strict compliant it is something we're trying to work too.
Use a standard cellpadding of 2 and cellspacing of 0 on outer tables. Inner tables can vary from 0 to 3 or even 4 depending on the need.
Use div container/css for styling and table for data representation.
The separate catXXXX and thXXX classes are gone. When defining a header cell just use <th> rather than <th class="thHead"> etc. Similarly for cat, don't use <td class="catLeft"> use <td class="cat"> etc.
Try to retain consistency of basic layout and class useage, i.e. _EXPLAIN text should generally be placed below the title it explains, e.g. {L_POST_USERNAME}<br /><span class="gensmall">{L_POST_USERNAME_EXPLAIN}</span> is the typical way of handling this ... there may be exceptions and this isn't a hard and fast rule.
Try to keep template conditional and other statements tabbed in line with the block to which they refer.
this is correct
PHP:
<span class="syntaxdefault"></span><span class="syntaxkeyword"><</span><span class="syntaxdefault">div class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"panel"</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">div class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"inner"</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">span class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"corners-top"</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">><br /><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">p</span><span class="syntaxkeyword">>{</span><span class="syntaxdefault">L_LOGIN_FORUM</span><span class="syntaxkeyword">}</</span><span class="syntaxdefault">p</span><span class="syntaxkeyword">><br /><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">fieldset class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"fields2"</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><!--</span><span class="syntaxdefault"> IF LOGIN_ERROR </span><span class="syntaxkeyword">--><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">>&</span><span class="syntaxdefault">nbsp</span><span class="syntaxkeyword">;</</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">dd class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"error"</span><span class="syntaxkeyword">>{</span><span class="syntaxdefault">LOGIN_ERROR</span><span class="syntaxkeyword">}</</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"></</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><!--</span><span class="syntaxdefault"> ENDIF </span><span class="syntaxkeyword">--><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">label for</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"password"</span><span class="syntaxkeyword">>{</span><span class="syntaxdefault">L_PASSWORD</span><span class="syntaxkeyword">}:</</span><span class="syntaxdefault">label</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">input class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"inputbox narrow"</span><span class="syntaxdefault"> type</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"password"</span><span class="syntaxdefault"> name</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"password"</span><span class="syntaxdefault"> id</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"password"</span><span class="syntaxdefault"> size</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"25"</span><span class="syntaxdefault"> maxlength</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"25"</span><span class="syntaxdefault"> tabindex</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"1"</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">/></</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"></</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">dl class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"fields2"</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">>&</span><span class="syntaxdefault">nbsp</span><span class="syntaxkeyword">;</</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">>{</span><span class="syntaxdefault">S_HIDDEN_FIELDS</span><span class="syntaxkeyword">}<</span><span class="syntaxdefault">input type</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"submit"</span><span class="syntaxdefault"> name</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"login"</span><span class="syntaxdefault"> id</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"login"</span><span class="syntaxdefault"> class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"button1"</span><span class="syntaxdefault"> value</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"{L_LOGIN}"</span><span class="syntaxdefault"> tabindex</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"2"</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">/></</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"></</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"></</span><span class="syntaxdefault">fieldset</span><span class="syntaxkeyword">><br /><br /></span><span class="syntaxdefault"> </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">span class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"corners-bottom"</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">div</span><span class="syntaxkeyword">><br /></</span><span class="syntaxdefault">div</span><span class="syntaxkeyword">></span><span class="syntaxdefault"> </span>this is also correct:
PHP:
<span class="syntaxdefault"></span><span class="syntaxkeyword"><</span><span class="syntaxdefault">div class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"panel"</span><span class="syntaxkeyword">><br /><</span><span class="syntaxdefault">div class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"inner"</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">span class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"corners-top"</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">><br /><br /><</span><span class="syntaxdefault">p</span><span class="syntaxkeyword">>{</span><span class="syntaxdefault">L_LOGIN_FORUM</span><span class="syntaxkeyword">}</</span><span class="syntaxdefault">p</span><span class="syntaxkeyword">><br /><br /><</span><span class="syntaxdefault">fieldset class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"fields2"</span><span class="syntaxkeyword">><br /><!--</span><span class="syntaxdefault"> IF LOGIN_ERROR </span><span class="syntaxkeyword">--><br /><</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">><br /><</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">>&</span><span class="syntaxdefault">nbsp</span><span class="syntaxkeyword">;</</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">><br /><</span><span class="syntaxdefault">dd class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"error"</span><span class="syntaxkeyword">>{</span><span class="syntaxdefault">LOGIN_ERROR</span><span class="syntaxkeyword">}</</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">><br /></</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">><br /><!--</span><span class="syntaxdefault"> ENDIF </span><span class="syntaxkeyword">--><br /><</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">><br /><</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">label for</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"password"</span><span class="syntaxkeyword">>{</span><span class="syntaxdefault">L_PASSWORD</span><span class="syntaxkeyword">}:</</span><span class="syntaxdefault">label</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">><br /><</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">input class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"inputbox narrow"</span><span class="syntaxdefault"> type</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"password"</span><span class="syntaxdefault"> name</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"password"</span><span class="syntaxdefault"> id</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"password"</span><span class="syntaxdefault"> size</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"25"</span><span class="syntaxdefault"> maxlength</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"25"</span><span class="syntaxdefault"> tabindex</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"1"</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">/></</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">><br /></</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">>[</span><span class="syntaxdefault">size</span><span class="syntaxkeyword">=</span><span class="syntaxdefault">85</span><span class="syntaxkeyword">][/</span><span class="syntaxdefault">size</span><span class="syntaxkeyword">]<br /><</span><span class="syntaxdefault">dl class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"fields2"</span><span class="syntaxkeyword">><br /><</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">>&</span><span class="syntaxdefault">nbsp</span><span class="syntaxkeyword">;</</span><span class="syntaxdefault">dt</span><span class="syntaxkeyword">><br /><</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">>{</span><span class="syntaxdefault">S_HIDDEN_FIELDS</span><span class="syntaxkeyword">}<</span><span class="syntaxdefault">input type</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"submit"</span><span class="syntaxdefault"> name</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"login"</span><span class="syntaxdefault"> id</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"login"</span><span class="syntaxdefault"> class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"button1"</span><span class="syntaxdefault"> value</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"{L_LOGIN}"</span><span class="syntaxdefault"> tabindex</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"2"</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">/></</span><span class="syntaxdefault">dd</span><span class="syntaxkeyword">><br /></</span><span class="syntaxdefault">dl</span><span class="syntaxkeyword">><br /></</span><span class="syntaxdefault">fieldset</span><span class="syntaxkeyword">><br /><br /><</span><span class="syntaxdefault">span class</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"corners-bottom"</span><span class="syntaxkeyword">><</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">span</span><span class="syntaxkeyword">></</span><span class="syntaxdefault">div</span><span class="syntaxkeyword">><br /></</span><span class="syntaxdefault">div</span><span class="syntaxkeyword">></span><span class="syntaxdefault"> </span>it gives immediate feedback on exactly what is looping - decide which way to use based on the readability.
--------------------------------------------------------------------------------------------------------------------
d/m/y
19/4/2009 - Victim_ - Revised
12/03/2012 - Victim_ - Re-formatted
