On 27/08/2011 3:13 PM, Boris Zbarsky wrote: > I never really got a useful response to > http://lists.w3.org/Archives/Public/www-style/2010Feb/0200.html > > In particular, it's not clear to me whether CSS2.1 even defines the > behavior. If it does, what's the right behavior? If it does not, what > CSS3 module is planned to define it? > > -Boris I need to check into this test further. One question that comes to mind is can a line box overflow it's container? My understanding of CSS2.1 is that this line box must be split over two lines since there are two inline boxes. I have not checked quirks mode but I can tell you that Opera 11.50 shows almost identical to IE9. The difference is only seen by adding some background colors. I have added to the test (code below) by adding a Y after the first span and adding a Z before the second span. No UAs show the same. <!DOCTYPE html> <div style="width: 100px; border: 1px solid green"> <span style="margin-right: 200px; background: rgba(0,0,255,0.5)"></span> <span style="margin: 0 -10px; background: rgba(255,0,0,0.5);"> <span style="display: inline-block; width: 20px; background: rgba(0,255,0,0.5);">Text</span> </span> </div> <div style="width: 100px; border: 1px solid green"> <span style="margin-right: 200px; background: rgba(0,0,255,0.5)">X</span> <span style="margin: 0 -10px; background: rgba(255,0,0,0.5);"> <span style="display: inline-block; width: 20px; background: rgba(0,255,0,0.5);">Text</span> </span> </div> <div style="width: 100px; border: 1px solid green"> <span style="margin-right: 200px; background: rgba(0,0,255,0.5)"></span>Y <span style="margin: 0 -10px; background: rgba(255,0,0,0.5);"> <span style="display: inline-block; width: 20px; background: rgba(0,255,0,0.5);">Text</span> </span> </div> <div style="width: 100px; border: 1px solid green"> <span style="margin-right: 200px; background: rgba(0,0,255,0.5)">X</span>Y <span style="margin: 0 -10px; background: rgba(255,0,0,0.5);"> <span style="display: inline-block; width: 20px; background: rgba(0,255,0,0.5);">Text</span> </span> </div> <div style="width: 100px; border: 1px solid green"> <span style="margin-right: 200px; background: rgba(0,0,255,0.5)"></span> Z<span style="margin: 0 -10px; background: rgba(255,0,0,0.5);"> <span style="display: inline-block; width: 20px; background: rgba(0,255,0,0.5);">Text</span> </span> </div> <div style="width: 100px; border: 1px solid green"> <span style="margin-right: 200px; background: rgba(0,0,255,0.5)">X</span> Z<span style="margin: 0 -10px; background: rgba(255,0,0,0.5);"> <span style="display: inline-block; width: 20px; background: rgba(0,255,0,0.5);">Text</span> </span> </div> -- Alan Gresley http://css-3d.org/ http://css-class.com/Received on Saturday, 27 August 2011 16:13:10 UTC
This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 22:50:05 UTC