Hi All,
I have a simple style sheet example below and I'm seeing different
results in IE 6 vs. Firefox 1.0.3. I'm not sure which browser is
rendering it correctly but I'm tending to think it's IE. In the code
below you will see two styled <p> elements within the <body> element.
There are two aspects of the rendering I wanted to ask about.
First, notice that Firefox simply ignores the "width:500px" rule
whereas IE honors it. Why is that? Is IE correct or is Firefox? If you
change the "display:inline" to "display:block" Firefox *will* honor the
width.
Now, if you changed "display:inline" to "display:block", please change
it back to "display:inline" before reading the next question.
The second point I wanted to ask about is the way Firefox chops off the
upper border. Why is that?
Thanks very much, I appreciate any helpful replies.
--
Tony LaPaso
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head><title>Test Page</title>
<meta http-equiv="content-type" content='text/html; charset="utf-8"'
/>
</head>
<body style="background-color:green; margin:0; padding:0;">
<p style='width:500px; background-color:white; display:inline;
border:solid; border-width:10px;'>This is the "Home Page
Header".</p>
<p style='width:500px; background-color:yellow; display:inline;
border:solid; color:red; border-width:10px;
padding:0px;'>This is some simple content.</p>
</body>
</html>