Category Archives: CSS

Last week I added the 2 Column Fixed CSS Layout example to the site.

The 3 column fixed CSS layout is very much the same except for a little extra markup and a few changes to the CSS to make the space for the extra column. Continue reading →

Whilst we’re still some way off being able to adopt CSS3 fully within web design. It’s certainly worth being aware of it’s capabilities and it would be great to start using it for those browsers that support it whilst ensuring that pages degrade gracefully for those that don’t.

If enough sites started to use the technology then surely the browser manufacturers would have to step up their attempts to support it with or without the W3C specification completed.

Obviously this could throw in complications with different browsers having different understandings of how to support CSS3 but for these CSS3 selectors at least, it seems as though all modern browsers support them. Continue reading →

Please note: There is an update to this article available here: CSS Reset

In recent years I’ve always used the global reset method in order to reset padding and margin’s throughout an HTML document.

I’ve always known that this has some issues with it when dealing with forms and am starting to come round to Eric Meyer’s way of using a baseline css file in order to reset the specific elements that you want to set as apposed to just assuming that all should be zero. Continue reading →

Here’s the 2 Column Fixed CSS layout that will be covered in the tutorial below.

There’s still a lot of people in the web design world that are still using tables for layout. Quite often this is due to lack of education or the fact that the person creating a web page has learnt how to use tables and is therefore reluctant to drop their inline styles and table layouts for CSS.

I came into the industry when table layouts were rife and there was no other way of creating graphical layouts without the use of tables so when CSS was finally supported by the leading browsers and we could finally forget about Netscape 4.2, it was difficult to change my way of thinking.

However, to create web pages that are standards compliant, cross browser compatible and accessible you’ll need to start using HTML and CSS correctly. Within this post, I’ll be guiding you through a basic CSS layout which you can then adapt to your requirements. Continue reading →

Within the Use HTML the right way post last week, I explained that it’s OK to use tables when you’re dealing with tabular data.

I’d therefore like to explain how to markup tables properly so that they can also be accessible. Continue reading →

Semantic markup is the way forward and has been for some time. Using CSS to style semantic markup separates the presentational code from the content making things simpler for the designer whilst also making the site much more accessible, and search engine friendly.

However, even people that embrace this method come unstuck when deciding which tag or array of tags to use for certain scenarios whilst the easiest and correct solution doesn’t always stand out. Continue reading →

Each browser has it’s own default rules and when it comes to padding and margin’s it can cause havoc when creating the CSS for a website.

However, there is a simpler solution than trying to change the code for each indivdual element that’s causing problems.

Using the following code at the start of a CSS document will set all padding and margin’s to zero and give you a consistent starting point.


* {
padding: 0;
margin: 0;
}


I’ve been doing a lot of reading recently and getting up to speed with the developments of CSS3 and discovering how it’s going to effect my day to day work. Continue reading →

From time to time I’ll come across a little tip or something useful that web designers should know or have easy reference to. When I’ve come across these bits of information in the past, I’ve usually added them to my browser bookmarks only to find that they become lost in a sea of favourites.However, so that these bits of information don’t get lost, I’m going to add them to my blog so that they’re much easier to reference. Continue reading →