Category Archives: Web Programming

CSS: How to create a three column layout without tables

In modern web design the use of tables got a bit outdated recently since they render slow and therefore do not contribute to a positive user experience. To everybody who is used to design his web projects with tables this might be annoying. However, CSS shows an easy way out here. You simply can mimic the behaviour of a table using division elements which contain each other in combination with CSS style sheets. The following example illustrates how this works. We want to reach the following requirements.

  • The page shall be divided in three colums
  • The central colum will have a fixed width
  • The remaining columns adapt their width dynamically

This layout can be very usefull if you want to see your content centred on the screen while the remaining white space is used for ads. The following code sample does exactly what has been required above:

<style type="text/css">
.container {
    float: left;
    width: 100%;

    width: calc(50% - 490px);

    width: 980px;

    width: calc(50% - 490px);
<div class="container">
<div class="columnLeft">
<div class="columnCenter">
Central Column
<div class="columnRight">
Right Column

To calculate the width in CSS dynamically the calc() function is used. It allows also to subtract a width in pixels from a width in percent. In case you want to have a empty column you should add a space like in the example, otherwise it will not render properly in some web browsers.

PHP Multifile Uploader for PHP 5.4, 5.5

Have you been looking for a simple PHP Multifile uploader script? Since version 5.4 PHP brings all the features to implement this fairly easy. No add-ons like APC are needed anymore. The script presented here can be used for multi- and single file uploads. It is really easy to install and therefore ideal for everyone who does not want the to figure out the built-in features of PHP.

It consists of the following components:

  • A simple from with a submit button
  • A Ajax Progress bar which is showing the progress of the upload
  • A feature to add as many inputs for as many files as you want

The script has been tested in a wide range of use cases and therefore proven to be operating stable. Upload limits for filesize etc. can easily be added to in the php.ini. That is all you need to know about the script. This is how the interface looks like:

To install the script you simply have to copy the files: php-multi-file-upload-script.php progress-frame.php, style-progress.css and upload.php in the same directory of your server which supports PHP > 5.4. After that the script should already work and you can customize the layout for your needs.

A live demonstration of the script you find here

The source code is available for download also for free here. It comes as a zip archive:

In case PHP is not configured correctly for file uploads just have look at you php.ini file. There the following three parameters should be adapted to your requirements:

; File Uploads ;

; Whether to allow HTTP file uploads.
file_uploads = On

; Temporary directory for HTTP uploaded files (will use system default if not
; specified).

; Maximum allowed size for uploaded files.
upload_max_filesize = 12M

Do not miss to set file_uploads to “On” otherwise PHP will winge. After you went through these steps the users of your website can enjoy fast and straight forward file uploads. Especially if larger uploads are required for your project your users will really enjoy the presence of this progress bar. Otherwise the might be to impatient to wait for the file upload having finished.

PHP Multi File Uploader with Progress Bar using APC

Important Update: If you are using PHP versions greater 5.3 you should use our new multi-file uploader script which does not depend on the APC cache. You find it here:

For older PHP versions just continue reading.

This little PHP Script allows you to upload multiple files at a time to a webserver. It is pretty easy to install and can easily be adapted and extended to your specific needs. The Ajax progress bar the script brings is based on jQuery. For a proper operation of the script the Alternative PHP Cache (APC) has to be activated.

Where to get the script?

How to install APC on a linux server?

In Fedora Linux you need the following packages to install APC using the pecl command afterwards.

yum install pcre-devel  php-pear php-devel httpd-devel

pecl install apc

The file /etc/php.ini should contain the following lines:
apc.enabled = 1
apc.max_file_size = 2000M
apc.rfc1867 = 1

An introduction how to install it from the source code you find here.

If you are not sure if APC is installed at your server contact the administrator.