Long has it been a problem for developers developing sites for browsers that do not support standards in their HTML and CSS. Creating a site that is accessible, clean and well coded is a problem with this respect because of the fact that some browser bugs can only be gotten round by either using ‘hacks’, or by creating a lot of excess code that really shouldn’t need to be there. But that is the crisis the developers face everyday.
Since I started building more professional looking web sites I have always looked to code in as a high a quality as possible for the task at hand. This is why, until recently, I had never touched on using absolute positioning. I’d always been told that it was a pain to use and never worked properly and that all kinds of trouble could be associated with it’s use (such as when a browser window was resized all of the elements started to overlap and look horrible). For that reason it was a complete no go area for me.
Time and time again when I’m teaching CSS, or looking through other people’s code I see things like:
border-width: 1px;
border-style: solid;
border-color: #000;
Or, as a more frequent example:
margin-top: 10px;
margin-bottom: 15px;
margin-left: 25px;
margin-right: 0;
That last example is four lines of code that could so easily be condensed into one simple line. The same applies to (X)HTML markup too. One of the more frequent examples I see of this is putting an image inside a div and using the div class or id to position that image. Save yourself some time and energy and stick the class or id in the image tag and get rid of the redundant div tag (I’ll be coming back to this later)!
For a long time, since I started taking a very active interest in Web Standards and learning CSS I have always queried the methods by which forms, such as contact forms, should be correctly marked up and displayed. Since I can remember building my first web site, there have been disagreements as to the correct semantic approach to mark-up when it comes to forms of all types.