Warning: session_start() [function.session-start]: Cannot send session cookie - headers already sent by (output started at /home/quillspi/public_html/articles/CSS-Box-Model-and-Standards-UnCompliant-Browsers.php:2) in /home/quillspi/public_html/templates/qsnet/header.html on line 3

Warning: session_start() [function.session-start]: Cannot send session cache limiter - headers already sent (output started at /home/quillspi/public_html/articles/CSS-Box-Model-and-Standards-UnCompliant-Browsers.php:2) in /home/quillspi/public_html/templates/qsnet/header.html on line 3
Website Redesign, Hosting, and Search Engine Optimization without the hype

Quill Spirit & Creativity - since 1999. (logo.gif) 

Quillspirit.net Articles - <!---BEGIN Title--->CSS Box Model and Standards UnCompliant Browsers<!---END Title--->
Google
 
Web Quillspirit.net

CSS Box Model and Standards UnCompliant Browsers
By: Jon Collins


One of the frustrating things in web design currently is the failure of major browsers to stick to one set of standards in what html tags are supported and how they are interpreted. If you are designing using CSS, it doesn't take long to realise that using the margin, padding and width properties often results in some stray pixels. The rule governing these things is called the CSS box model.

Unfortunately, IE5/win had its own ideas about the box model and interprets width as the distance between the outer edges of the box borders whereas the correct interpretation is the distance between the outer edges of the actual content (the inner edges of the padding).

This is just one of the many problems you encounter when you start thinking beyond how your page renders in just your own browser with your screen resolution. The method I use on my sites to reign in those pesky browser variations is to use a strict document type definition (DTD) on all pages. It can restrict some aspects of your creativity, but in terms of getting everything in the same place in different browsers, it makes things a lot easier. To do this, just add the following as the first line of your HTML document (before the tag):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> If you use Javascript, your problems will increase even further! The way Javascript is interpreted is different for pretty much every browser and often your functions will require some tweaking or even a number of separate parts to achieve the same results on different browsers.

Everyone join the campaign for standards compliance among browsers so we can stop losing time making our pages cross-browser compatible!!

Jon Collins has nearly 10 years experience of taming HTML. For more information that will make your website stand out from the crowd of average sites, visit UK Webmaster Advice.

 


Return to Index

Server powered by:
Need to report Spam from our server? Contact Us! We maintain a very strict anti-spam policy... we don't like it, and we know you don't either! kiosk.ws Web hosting

Website design ©: Shawn M. J. Mann - Quillspirit.net