I was doing some scripting in PHP to create tables with data drawn from a database. Drawing multiple fields using the same script caused the table layout to shift. This can be fixed using the tag within the table. I thought it was kind of interesting, so I thought sharing it using an example.
An example of a 3 column table setup would be something like this:
<table width="400" border="1"> <?php $table_count = 0; ?> <?php if(count($this->items) > 0): //if there's content foreach($this->items as $content): //loop through all content if( $table_count == 0 ): ?> <tr> <?php endif; ?> <td width="33%"> //to create 3 columns //insert content here </td> <?php if( $table_count == 2 ): ?> //3 columns, so table_count = 3 - 1 = 2 </tr> <?php $table_count = 0; ?> //column length reached, reset count <?php else: ?> <?php $table_count++; ?> <?php endif; ?> </table>
I was using the same script to parse multiple database fields onto 1 page. E.g. an employees page of a company. The page would display all the employees categorized in different positions within the company, so the number of people per position varies.
The script shown above would be used for all the categories to create a 3 column table.
Creating the table works fine, if we parse content of 3 or more items from the database to PHP. But a problem occurs with the layout if there are less items than the number of columns within a category.
Example with enough items:
Item 1 | Item 2 | Item 3 |
Example if the database field has only 2 items (using the same script)
Item 1 | Item 2 |
To fix this, simply add a table-layout CSS style and <col>
><table width="70%" style="table-layout:fixed"> <col width="33%"> <col width="33%"> <col width="33%">
Have fun 🙂
Related Posts
April 6, 2012
Xpider Sven
December 15, 2017
Why Can’t I Report Scam & Phishing Emails On Outlook.com Beta?
A new beta version rolled out a few months ago and they've removed the option to mark and report an email as "Phishing scam"...
March 15, 2014
[FIX] Unity3D – Animation Must be marked as Legacy Warning
How to fix animation warning "must be marked as legacy" in Unity3D
September 18, 2013