Forum Moderators: not2easy
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test 1</title>
<style type="text/css">
.Name
{
width: 135px;
border: 1px solid #999999;
}
.Phone
{
width: 135px;
border: 1px solid #999999;
}
</style>
</head><body>
<span class="Name">
My Name here
</span>
<span class="Phone">
(999) 999-9999
</span>
</body>
</html>
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test 2</title>
<style type="text/css">
.Name
{
width: 135px;
border: 1px solid #999999;
}
.Phone
{
width: 135px;
border: 1px solid #999999;
}
</style>
</head>
<body>
<span class="Name">
My Name here
</span>
<span class="Phone">
(999) 999-9999
</span>
</body>
</html>
HTH,
CK
[edited by: tedster at 3:12 am (utc) on Mar. 27, 2004]
[edit reason] fix url [/edit]
The first example causes IE to render the page in "standards compliant mode", whereas the second example causes IE to render the page in "quirks mode". The biggest difference between the two rendering modes is compliance with CSS standards, the box model in particular.
Microsoft gives a very good overview of the two differences: [msdn.microsoft.com...]
The reason why the second example throws IE into quirks mode is because the doctype, even though it is valid, does not come FIRST on the page.
The important thing to remember is that most other browsers will render the page according to the standards.