#515 closed Bug (fixed)
Tables are rendered in quirks mode
| Reported by: | Alfonso Martínez de Lizarrondo | Owned by: | |
|---|---|---|---|
| Priority: | Normal | Milestone: | FCKeditor 2.5 Beta |
| Component: | General | Version: | FCKeditor 2.4.2 |
| Keywords: | Confirmed | Cc: |
Description
This is a strange behavior:
Set in the config file a doctype to trigger standards mode like
FCKConfig.DocType = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">' ;
now go to edit and in the source mode insert this test code
<div style="width:300px; border:20px solid black; padding:30px">If this is rendered in standars mode it will have the same width as the red bar</div> <div style="width:300px; background-color:blue;"> </div> <div style="width:400px; background-color:red;"> </div> <div style="font-size:10px; font-family:Verdana"> Text outside the table <table border="1"> <tr> <td>Text in the table</td> </tr> </table> If this is rendered in standards mode the text size inside the table will be the same as this one. </div>
Expected results: the content is rendered using the standards mode.
Actual results:
Firefox: divs OK, but the font in the table isn't inherited.
IE6: divs OK (so it's using the correct box model), but again the fonts are wrong inside the table.
Opera 9.2: the same behavior, divs OK, table wrong.
That doesn't make sense, if the page is rendered in standards mode then the styles should be inherited in the table (and checking the compatMode in Firefox show that it's set right)
Now use full page mode (example 7), the full page content now is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Quirks test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div style="width:300px; border:20px solid black; padding:30px">If this is rendered in standars mode it will have the same width as the red bar</div>
<div style="width:300px; background-color:blue;"> </div>
<div style="width:400px; background-color:red;"> </div>
<div style="font-size:10px; font-family:Verdana">
Text outside the table
<table border="1">
<tr>
<td>Text in the table</td>
</tr>
</table>
If this is rendered in standards mode the text size inside the table will be the same as this one.
</div>
</body>
</html>
And now the results are:
Firefox: no change, divs OK, tables wrong
IE6: wops!, divs OK AND tables OK. everything works.
Opera: as IE, now both divs and tables OK, everything works
What's more, trying to get a testcase to find if this is a problem with designMode itself shows it correctly in Firefox also
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/DTD/strict.dtd">
<html>
<head>
<title></title>
<style>
</style>
<script language="javascript">
function editDocument()
{
var html = document.body.innerHTML;
document.designMode='on';
document.body.innerHTML = html;
}
</script>
</head>
<body>
<input type="button" onclick="editDocument(); return false;" value="Enable designMode">
<div style="width:300px; border:20px solid black; padding:30px">If this is rendered in standars mode it will have the same width as the red bar</div>
<div style="width:300px; background-color:blue;"> </div>
<div style="width:400px; background-color:red;"> </div>
<div style="font-size:10px; font-family:Verdana">
Text outside the table
<table border="1">
<tr>
<td>Text in the table</td>
</tr>
</table>
If this is rendered in standards mode the text size inside the table will be the same as this one.
</div>
</body>
</html>
Attachments (1)
Change History (6)
comment:1 Changed 17 years ago by
| Keywords: | Confirmed added |
|---|---|
| Milestone: | → FCKeditor 2.5 |
| Version: | → FCKeditor 2.4.2 |
comment:2 Changed 17 years ago by
I think that the only bug is really in Firefox, the behavior of IE and Opera might be due to the style set in the default StyleSheet for body and td, so I'll forget about it for the moment (I was so annoyed with Firefox that I started seeing bugs everywhere).
The attached testcase represents a minimal testcase. Removing the
oIFrame.src = 'javascript:void(0)' ;
Makes Firefox behaves properly.
Opera and Safari don't have any problem at all with this testcase.
Tomorrow I'll search for a filed bug in bugzilla. If I'm correct the reason of 'javascript:void(0)' is to avoid errors in IE if the server is in a https server, right?
Then we could set that line only if the browser is IE or it isn't Firefox, whatever brings us less troubles.
comment:3 Changed 17 years ago by
Filed https://bugzilla.mozilla.org/show_bug.cgi?id=387872 and added the testcase to the browserbugs repository
comment:4 Changed 17 years ago by
| Resolution: | → fixed |
|---|---|
| Status: | new → closed |
I've commited the change as described yesterday: the iframe of the editing area now isn't set to an initial src and that fix the behavior of Firefox.
With regards to the rest of the initial report: it was due to the rule for td in fck_editorarea.css, removing it makes all browsers behave the same. I've filed #960 to change the default doctype to one that does trigger standards mode and so remove that td rule from the stylesheet.
Well... it sounds really weird. Mainly the IE and Opera different behaviors if FullPage.
Let's make a deeper investigation spot the problem. I have the impression that FF uses the mode running in the parent window, or the window that creates the editable IFRAME, ignoring the DOCTYPE.