Tony's blog

Recently I had a design provided that required a scalable image either side of the content area when the screen was wider then a specif point.
Since it has been a long time since my last blog post, I thought I would share my solution.

The image needed to scale so that width wise it fitted on screen and scaled up to a maximum size.
Afetr that maximum size the image no longer scales and just sits either side of the content.

We have reached 10 years old, a fair age for any website. Actually the domain was registered in October 2002, the site started with the CSS Generator and I added the forum in March 2003. So we are actually closer to 10.5 years old. I would like to thank all the people who have been involved, specially the moderators who keep this place running when I leave it in auto pilot mode.

An named anchor, so you could target section of the page, like jump to content, used to be

<a name="content"></a>

<a href="#content">Jump to content</a>

Or you could add '#content' without the quotes to the end of the url in the browsers address bar.

When I first wrote about what's known as the Clearfix technique in 2004, I knew it was going to be useful. It was to solve a problem that previously required us to add extra markup to the page. I had no idea it would still be used in one of it's many forms in most CMS and a large percentage of all websites 8 years later.

Browsers have come a long way since then, most of the browser versions we had to support are not even thought of these days.

Validate
Use a valid doctype and validate your markup and styles.
This will help you find out if something as simple as a typo or an unclosed element is causing the problem.

Test in other browsers
Browsers have different base styles and varying support for CSS properties. Knowing in which browsers the problem occurs, make it easier to find a solution. Your problem may be a browser not implementing a CSS property.

Inspect