Wednesday 21 March 2007

PHP: making a neat list of items

I have spend quite a few hours trying to get a list of links in my navigation that looked neat and tidy in both Mozilla based browsers and in IE. I tried to use UL and LI with all sorts of CSS but never got a result I liked. So I went back to using a TABLE. It might be regarded as not sophisticated but it gives the best list in my view.

I wanted to get a list of links (taken from a DB) and show them all under each other slightly indented to the right and a small bullet in front of each item.

I wrote the small piece of PHP to do this efficiently and neatly with a TABLE.

echo '<table border="0">';

while ($row = mysql_fetch_assoc($result)) {

echo '<tr><td><img src="buloranje.png"> <a href="index.php?page=link' .
$row['album_id'] . '">' . $row['al_name'] . '</a>' .
'</td></tr>';
}

echo '</table>';


The image of the bullet is 6px high and 4px wide. The bottom two lines of the image are transparent so that the bullet stands in the middle of the text.

Each link is stored in a row of $result by a SQL query.
The WHILE loop writes a line of the table <TR><TD> as long as there are results in $result. The link and display text is also build up out of data from the database.

When there are no more links to show, the table is closed.

No comments: