(At the end of the email you will find the script to play with inside the
other browser to see if it has the same problem as describe below)
If mozilla is a child of Netscape, the son makes a lot of progress since
his birth and some Netscape errors have been forgotten but they are still
their. Do not think that Mozilla will work the same way as Netscape. Since
now their was not big difference between, mozilla and Netscape except that
Netscape considers nodeText as an indenpend box( In javascript if you click
on a text, Netscape will not detect its parent as Mozilla and other browser
did) but this I afternoon I had a big surprise.
The Netscape 7.0 and IE 5.1 bug on Mac.
I discover today that Netscape doesn't know how to manage object with
position relative inside object with relative position wich contain or not
contain float element. The result is unpredictable. The width is changing,
even if it has a fix size, when you change de margin-left of the inside
element.
When you change de margin-top the position change depending if the float
box is present or not. If it present the margin is set the right way, if
not the object sart to move in an unpredictable manner.
Padding of the parent affect margin of the child. The margin start working
at the moment we add the parent padding.
MarginTop of the parent and of the child depends of the margin of the
other child and parent. You are not able to set them independently.
Naturally, this will not happend I presume with FireFox.
Mac IE seems to react the right way but IE is not able to manage the
relative box wich is inside an other box if there is a float. The float
have an impact on the size of the box except if we move it down from one or
more pixel.
The Mozilla 1.3 problem- Firefox ?
In Mozilla 1.3 Relative element inside other relative element don't let us
change the margin-top of the child. All are inter-dependent. Worst, The
size of the child margin-top change the position of the parent if only the
size is greater than the parent. Exemple If the parent have a margin-top
of 50px the child must have 55px to let the parent and all the child to
move down from 5px. Just the margin-top of the parent is changing. The
child stay at the top level of their parent. I presume that it has been
change in Firefox(let me know).
In IE mac there is no problem it works properly.
I presume the right behavior is that the margin don't dependent of their
parents margin isn't it? (Taking off position relative change nothing).
Then what will we do if we start to manage complex pages? The browsers are
still giving us headhache.
Berry
<style type="text/css">
#XOObjet0 { background-color: rgb(204,204,204); }
#XOObjet1 { background-color: black; margin-left: 10px; }
#XOObjet2 { background-color: rgb(204,195,51); margin-left: 0px; }
#XOObjet3 { margin-top:50px; padding-top:10px; background-color:
rgb(255,195,51); }
#XOObjet4 { background-color: blue; margin-top:10px; margin-left:100px;}
#XOObjet5 { background-color: red; margin-top:30px; }
</style>
<script type="text/javascript"></script></head>
<body>
<div id="XOObjet1" style=" position:absolute; height:200px; width:200px">
<div id="XOObjet3" style=" position:relative; height:100px; width:50px">
<div id="XOObjet0" style="float:right; height: 50px; width:50px"> </div>
<div id="XOObjet4" style="position:relative; height:60px; width:60px">
<div id="XOObjet5" style="position: relative; height: 20px;
width:20px" ></div>
</div>
</div>
</div>
</body></html>
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
