Archive for the ‘CSS’ Category

Quick Web Development Tip

If you are running a two-monitor setup and are building a website, you most likely are coding on one screen and previewing in another. Here’s a quick tip to save a bit of time refreshing the page every time you make an update: put this bit of old-school nasty HTML in the head of youor template page:
<meta http-equiv="refresh" content="3">

This will refresh your page every 3 seconds, saving you having to flick over and refresh. Don’t forget to take it out when you are done!

Quick CSS Tip

This came up when I was working on the X Communciations website. Some browsers, such as Safari and Firefox, only display the scrollbar when needed. This results in a “jump” half the width of the scroll bar if you have a centred website, and you go from a page with no scrolling to a page with scrolling. This can look icky. To get around it, just add:

body, html { height:100%; margin-bottom:1px; }

to your CSS. It makes your page 1px higher than the height of the screen, forcing a scrollbar onto every page. I found this tip on Jon Hicks’ website.

X Communications website is now live

Large X shape made up from various orange rosettes

I’m a few days late posting this, but the X Communications website is now live on the interweb. I’m very happy with how the design turned out, and I think the code is pretty too - I tried to make it as semantic as possible, and keep the div count reasonably low. X Communications is where I work full-time, so should anyone want to employ me for my “mad design skillz” as the leet-speakers would have it, then that’s where you’ll find me.

On a side note, this site is very much a personal blog, rather than a work thing, but I’m really pleased with the way the site turned out (though I’m very self-critical), so that’s why I’m posting it here. If you have any questions about how things were done, send me an email or leave a comment

Icon Factory and the W3C

The Iconfactory

Look who’s had a visit and a bit of a talking too about the state of their markup! Great animation that really gets the message across… hope it turns out well!

Blogged with Flock

Clever Portfolio Idea

I found a very clever idea on this portfolio site:
http://www.webhues.com/samples/pf/bas.asp
See how you can scroll the screenshots? Easy to achieve, but very clever and something I’ve never seen before.
Adding that one to the ideas toolbox.