Action, protest, campaigns, demos and issues magazine features, photos, articles, stories photos of London, New York, Wales, England and photography features music, parties, clubs, events, records, releases drug information, harm reduction, no-nonsense guide punch a celebrity football, features, issues, cardiff city games, useless games and diversions technical info, web authoring, reviews and features site news, updates and urban75 blog urban75 community news and events urban75 bulletin boards join the chatroom search urban75 back to urban75 homepage
London features, photos, history, articles New York features, photos, history, articles Brixton features, photos, history, articles panoramas, 360 degree vistas, London, New York, Wales, England Offline London club night festival reports, photos, features and articles urban75 sitemap and page listing about us, info, FAQs, copyright join our mailing list for updates and news contact urban75
web question and answers

« Q & A page

« tech pages

Q: How do I use style sheets instead of tables?
by Mike Slocombe

Q: I use style sheets a lot for text formatting, but don't understand how to use them for tables. Can they cover cell spacing and padding? What about defining the number of rows and columns?
Steve Norris

A: Tables weren't designed as graphic page layout tools, although arty authors have been using them for years, often employing time -honoured bodges like the 'invisible table trick' (

Style sheets promise to banish tables forever, giving you more control over layout by separating presentation from content, and serving up a more accessible site in the bargain. Here's an example:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<style type="text/css">
.leftcol {
background-color : #FFFF00;
left : 40px;
position : absolute;
top : 10px;
width : 100px;
<DIV class="leftcol">
Yo! A yellow 100 pixel wide column!

In this example, we've created a class called 'leftcol' in the style sheet. The DIV tag calls the leftcol class and creates a yellow box, 100 pixels wide, positioned 10 pixels from the top and 40 pixels to the left of the page. Easy.

As ever, implementation of CSS is bedevilled by all manner of kray-zee Netscape/IE browser quirks and anomalies, so be sure to test your pages on as many different browsers and operating systems as possible.

More info: CSS layout templates

Jan 2004

urban75 - community - action - mag - photos - tech - music - drugs - punch - football - offline club - brixton - london - new york - useless - boards - help/FAQs - © - design - contact - sitemap - search