Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Differences in rendering elements between Mozilla/Firefox and IE

Reply
Thread Tools

Differences in rendering elements between Mozilla/Firefox and IE

 
 
Sergey Ilinsky
Guest
Posts: n/a
 
      01-31-2005
Well, while working on a rich ui with DHTML I discovered the following
problem:
Mozilla/Firefox seems to be wrong when rendered elements with sizes
given in percents and that are placed into another elements with
percentage sizes, if the content overflows them (of course, overflow is
set to the value of "scroll")

To check the written above please use the given below code

<table style="" height="50%" width="100%">
<tbody>
<tr><td height="25%"><br /></td></tr>
<tr><td height="50%"><div id="eContainer"
style="width:100%;height:100%;overflow:scroll;"><b r />a<br />a<br />a
<br /> a<br />a<br />a<br />a<br />a<br />a<br /> a<br />a<br />a<br
/>a<br />a<br />a<br />a<br />a </div></td></tr>
<tr><td height="25%"><br /></td></tr>
</tbody>
</table>

You see, that DIV element got much more than 0.5*0.5=0.25 = 25% of the
available document height. Moreover, this element doesn't offer you to
scroll its content.
Why? Can somebody give an explanation and a hint how to get the same
behaviour way that IE has (IE renders a layer with 25% height)?
Why does Mozilla/Firefox render elements proper way when the content
doesn't overflow?

 
Reply With Quote
 
 
 
 
kaeli
Guest
Posts: n/a
 
      01-31-2005
In article < .com>,
enlightened us with...
> <table style="" height="50%" width="100%">
> <tbody>
> <tr><td height="25%"><br /></td></tr>
> <tr><td height="50%"><div id="eContainer"
> style="width:100%;height:100%;overflow:scroll;"><b r />a<br />a<br />a
> <br /> a<br />a<br />a<br />a<br />a<br />a<br /> a<br />a<br />a<br
> />a<br />a<br />a<br />a<br />a </div></td></tr>
> <tr><td height="25%"><br /></td></tr>
> </tbody>
> </table>
>
> You see, that DIV element got much more than 0.5*0.5=0.25 = 25% of the
> available document height.


It isn't supposed to get 25% of the DOCUMENT height.
It is relative to its container - which is not the document. It's the table
cell. You're probably looking at this in IE quirks mode, since I don't see a
doctype. Don't expect different browsers to render the same when you don't
give a doctype with a URL.

Also, you might want to validate your html. I'm pretty sure there is no
attribute "height" for table. And the height attribute of TD is deprecated.
http://www.w3.org/TR/html401/struct/....html#h-11.2.1

The above will render differently depending on the doctype. Which you didn't
mention.

BTW, this has nothing to do with javascript, so it's OT here. You'd get
better answers at comp.infosystems.www.authoring.* groups.

--
--
~kaeli~
A little rudeness and disrespect can elevate a meaningless
interaction to a battle of wills and add drama to an
otherwise dull day.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
DEVELOP THE WINNING EDGE, SMALL DIFFERENCES IN YOUR PERFORMANCE CANLEAD TO LARGE DIFFERENCES IN YOUR RESULTS Home_Job_opportunity C Programming 0 01-14-2009 03:51 PM
DEVELOP THE WINNING EDGE, SMALL DIFFERENCES IN YOUR PERFORMANCE CANLEAD TO LARGE DIFFERENCES IN YOUR RESULTS Home_Job_opportunity C Programming 0 01-08-2009 04:31 PM
Differences between PC/MAC Firefox rendering? Aaron Freeman HTML 1 03-22-2006 06:57 PM
Differences in aspx page rendering between environments =?Utf-8?B?UnlhbiBBbmRlcnNvbg==?= ASP .Net 1 02-07-2005 10:27 PM
Differences between Photoshop Elements 2.0 (PSE2) and Paint Shop Pro 8.0 (PSP8) Roger Digital Photography 18 05-25-2004 01:04 PM



Advertisments
 



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57