DHTML Lab - DHTML Diner - Element Page Coordinates, Part 3 | 5
Determining Element Page Coordinates, Part 3
|
On this page, our red square is placed within a nested table.
The outer table has a 5-pixel border specified. The inner one, a 1-pixel border as before.
Move the blue square.
|
<TABLE CELLSPACING=0 CELLPADDING=0 BORDER=5 BORDERCOLOR=yellow>
<TR><TD WIDTH=20> </TD>
<TD WIDTH=20> </TD><TD> </TD></TR>
<TR><TD> </TD><TD> </TD><TD> </TD></TR>
<TR><TD> </TD><TD> </TD>
<TD>
<TABLE CELLSPACING=0 CELLPADDING=0
BORDER=1 BORDERCOLOR=#3AF600>
<TR><TD WIDTH=20> </TD><TD WIDTH=20>
</TD><TD> </TD></TR>
<TR><TD> </TD><TD> </TD><TD> </TD></TR>
<TR>
<TD> </TD><TD> </TD>
<TD><IMG ID="redbox" SRC="redbox.gif"
WIDTH="200" HEIGHT="200"></TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
|
Result
  |
 |
Right on the money again, for NS6 and Mozilla up to 0.9.6. |
  |
 |
Our positioning is off by six pixels in NS7 and Mozilla 0.9.7+. |
Unlike the tests we did in Part 2 with IE (where we were off by two pixels) the Gecko behavior is clearly related to the value of the BORDER attribute. But why do we see this behavior only in recent browser versions?
Produced by Peter Belesis and
All Rights Reserved. Legal Notices.Created: Oct 16, 2002
Revised: Oct 16, 2002
URL: http://www.webreference.com/dhtml/diner/realpos3/5.html
Find a programming school near you
