CSS positioning tutorial

Now the web-trendies and accessibility gurus abhor table-based layouts it pays to gain some expertise with the Cascading Style Sheets properties position, float and clear in order to set your website out nicely.

There's a good tutorial / demonstration of the effects of position: static, position: relative, position:absolute, float and clear at BarelyFitz Designs - Learn CSS Positioning in Ten Steps.

Good CSS tutorial

For any webmasters or webmistresses who want to learn the basics of CSS (selectors, positioning, formatting and so on) there is an excellent tutorial at MaxDesign. In particular, their Floatutorial is a particularly clear and useful document about how to use floats, clear and so on. Plenty of practical examples of common effects are to be seen. Assuming that your target visitors use CSS compliantish browsers that is.

Adding a no wordwrap option to img_assist

Note: this article is outdated now as the official Image Assist module now contains a no-word-wrap feature within it.

The Poorhouse's current favourite way of easily inserting images into Drupal nodes is to use the module img_assist. To use it, you also need to install the image module.

JAlbum - static web photo album software that is actually good

JAlbum: Box, camera and screen not includedJAlbum: Box, camera and screen not includedIn these Net 2.0 days of flickr, Imageshack, Yahoo photos and so on, it might seem like it's never been easier to publish your home snaps. That's probably because it's true. However, easy doesn't always equal perfect. Sometimes you might want to have a web-traditional photo gallery on your own website, so you have full control over addresses, formatting, content, size and so on.

How to enhance your trial-and-error webdev experience

An exCSSively useful menuAn exCSSively useful menuIn recent times, the Poorhouse has gained a new favourite extension for Firefox. The Web Developer extension, which works on Firefox, Flock, Mozilla and Seamonkey web browsers contains far-too-numerous to list that aid the creation of one's own pages, and dare it be suggested the deconstruction of other people's pages - all in the name of research naturally.

A few favourite features include the ability to immediately disable various features of pages such as redirects, Javascript etc., validate any code under various standards, manipulate forms and images, resize the browser window to standard screen-size resolutions and a whole host of information gathering / layout visualising options.

Griddled to perfection

Want to replicate your finest-but-complexist tabular data on the web? You'll no doubt want a grid provide visual clarity. Seeing as it's the year 2010(ish) of course CSS is the way to go. But when the Poorhouse wanted such an effect, it wasn't quite so obvious how to achieve. In an effort to spare the highs and lows of the technique for other amateur web-kidz, here's how we did it.

Assuming you don't want all your tables to look like grids, you'll want to work on a new class of <table>, called perhaps, pick word at random, "grid". Each cell aka <td> of the table wants to be entirely surrounded by borders to give the impression of individual rectangles. Let's use the power of CSS inheritance to make it so:

Syndicate content