We’ve already covered how to centre a web page horizontally regardless of screen resolution. Sometimes though, you may want to centre a div horizontally and vertically.
How do I stop the flicker when people hover over my links’ background image?
A Typical Scenario
You have a logo/picture link that you want the background to change when the mouse hovers over it. Simple, you might think; using CSS, specify one background image for the ‘unhovered state’ and a separate background image for the ‘hover’ state. Something like this:
Aug 122008
Sometimes you want to use a font for your headings that isn’t available on other people’s computers so you use a fancy font image instead. But there’s a problem if you do this. People using screen readers/text browsers won’t be able to see the image and therefore the heading text.
Image replacement techniques have been around for years but my preferred method is Mike Rundles from way back in 2003.
Jun 292008
Lets get the css section cracking with perhaps the most often asked question of them all!!
‘How do I centre my site regardless of the screen resolution?’
Let’s start by defining the width we would like our content to be. For this example I’ve chosen 780px. We need to ‘wrap’ all of our content in a container 780px wide. Continue reading »
Conditional Comments
You’ve built a site and it looks great on Firefox, Safari, Opera etc but after taking a look at it using Internet Explorer, your heart sinks as you see your wonderful website messed up beyond belief!
I always use Firefox during the development process to check how my website looks as it renders web pages the ‘correct’ way. (The various add ons that are available make it a great choice too). However, I also ensure that the site looks the same in all browsers. Internet Explorer (especially IE6) is the curse of many a web designer and can cause lots of problems for the newcomer to web design.
Continue reading »