[prev in list] [next in list] [prev in thread] [next in thread]
List: kfm-devel
Subject: Re: Table rendering problem, feature or normal ?
From: Vadim Plessky <lucy-ples () mtu-net ! ru>
Date: 2001-11-24 11:30:50
[Download RAW message or body]
Hi Joseph!
On Saturday 24 November 2001 09:27, Joseph Wenninger wrote:
|
| I enclose a "small" example file.
|
Thanks for your testcase!
| I'm not sure, if this is a bug, but Mozilla and IE render it quite
| different. Thosw browsers show the tables in that way, that all middle cell
| separators are exactly in one line. Konqy in the 2.2 Branch gets very slow
| and renders the tables 20 times the window size. Konqy in KDE 3 doesn't
| show the cell separation in one line.
The only problem I see (in KDE 2.2.1) is that cell sizes in different tables
are not equal (while should be always 50% of TABLE, which is 100% of BODY)
This is, indeed, a bug in KHTML.
Note also that I tested your example in Opera5/Linux, and rendering in Opera
was exactly like in Konqueror. (ok, Opera is also broken, both Opera and
KTHML need to fix this)
Anyway, I have a workaround for you - see below.
|
| I know it should be done with one table instead of many (perhaps
| rendering speed up on some browsers), but I found this kind of code in some
| webapplications we use at work and it only seems to break in konqy.
|
As I said, it's also broken in Opera5.
| *********************
| Some other thing, which I don't know why is, that konqy seems to be very
| very slow in rendering tables at all. Webpages which are developed in the
| company I'm working at, are rendered about twice as fast in Mozilla and IE.
Rendering of tables in Konqueror seems pretty fast for me.
What kind of hardware do you use?
(if you run Mozilla, I guess you have at least 64MB of RAM, am I correct?)
My stress-test examples show that Mozilla is slower on tables than Konq,
while IE is faster. Let me know if you are interested to see those testcases.
Now about ideas.
~ ~ ~ ~ ~ ~ ~ ~ ~
I re-wrote your example in such a way that it doesn't uses TABLEs anymore and
renders exactly as you expect. Please consider attached tables-BigFoot-3.html
and tables-BigFoot-3b.html (second adds extra DIV and formatting to emulate
look'n'feel you had with tables)
I would be surprised to hear from you that *this code* renders slowly -
number of HTML elements was decreased significantly, and code itself is more
clean (just DIV, SPAN and INPUT elements)
This code is fully CSS-ized, and *ready to be XML-ized*.
In fact, you can do from it XHTML or pure XML testcase in less than 1 minute.
Pls let me know if this workaround is ok for you. I tested it with Konq,
Opera5/Linux and Mozilla/Galeon, all those browsers render it in the same way
(so, really cross-browser code... :-)
What kind of project you are working on?
If you can give better description, may be I can help you further.
|
| Any ideas ?
|
| Kind regards
| Joseph Wenninger
Cheers,
--
Vadim Plessky
http://kde2.newmail.ru (English)
33 Window Decorations and 6 Widget Styles for KDE
http://kde2.newmail.ru/kde_themes.html
KDE mini-Themes
http://kde2.newmail.ru/themes/
["tables-BigFoot-3.html" (text/html)]
<HTML>
<head>
<style type="text/css">
table { width: 100% }
td { width: 50% }
.aa { color: #000000 }
.L { width: 50%;
float: left;
border: 1px solid navy }
.R { width: 50%;
margin-left: 50%;
border: 1px solid gray }
</style>
</head>
<BODY>
<div class="L">
<span class="aa">SAVE_FILE:</span>
<input name="SAVE_FILE" type="checkbox">
</div>
<div class="R">
<span class="aa">OPEN_PROJECT:</span>
<input name="OPEN_PROJECT" type="checkbox">
</div>
<div class="L">
<span class="aa">DELETE_CONTENT:</span>
<input name="DELETE_CONTENT" type="checkbox">
</div>
<div class="R">
<span class="aa">REWINDTO_FILE:</span>
<input name="REWINDTO_FILE" type="checkbox">
</div>
<div class="L">
<span class="aa">OPEN_FILE:</span>
<input name="OPEN_FILE" type="checkbox">
</div>
<div class="R">
<span class="aa">REWINDTO_OPERATOR:</span>
<input name="REWINDTO_OPERATOR" type="checkbox">
</div>
</BODY>
</HTML>
["tables-BigFoot-3b.html" (text/html)]
<HTML>
<head>
<style type="text/css">
table { width: 100% }
td { width: 50% }
.aa { color: #000000 }
.L { width: 50%;
float: left;
border: 1px solid navy }
.R { width: 50%;
margin-left: 50%;
border: 1px solid gray }
.spacer { margin: 0;
padding: 0.5em;
/* margin-top: 0.5em; margin-bottom: 0.5em; */
border: 2px solid gray }
</style>
</head>
<BODY>
<div class="spacer">
<div class="L">
<span class="aa">SAVE_FILE:</span>
<input name="SAVE_FILE" type="checkbox">
</div>
<div class="R">
<span class="aa">OPEN_PROJECT:</span>
<input name="OPEN_PROJECT" type="checkbox">
</div>
</div>
<div class="spacer">
<div class="L">
<span class="aa">DELETE_CONTENT:</span>
<input name="DELETE_CONTENT" type="checkbox">
</div>
<div class="R">
<span class="aa">REWINDTO_FILE:</span>
<input name="REWINDTO_FILE" type="checkbox">
</div>
</div>
<div class="spacer">
<div class="L">
<span class="aa">OPEN_FILE:</span>
<input name="OPEN_FILE" type="checkbox">
</div>
<div class="R">
<span class="aa">REWINDTO_OPERATOR:</span>
<input name="REWINDTO_OPERATOR" type="checkbox">
</div>
</div>
</BODY>
</HTML>
[prev in list] [next in list] [prev in thread] [next in thread]
Configure |
About |
News |
Add a list |
Sponsored by KoreLogic