[CSS2.1] Position of absolute position box in relative box with text-align center from Greg Whitworth on 2014-09-15 (www-style@w3.org from September 2014)

From: Greg Whitworth <gwhit@microsoft.com>
Date: Mon, 15 Sep 2014 23:45:48 +0000
To: "www-style@w3.org" <www-style@w3.org>
Message-ID: <3e825eb31af54425b7c5067f2090a987@DM2PR03MB400.namprd03.prod.outlook.com>

Hello all, I have the great pleasure of bringing another 2.1 interop issue to the list for discussion very close to the last one regarding placement of absolute positioned boxes [1]. This one is interesting as Chrome and FF place the box all the way to the left of the viewport while IE places it at the center. Based on the 2.1 spec [3], I believe that IE is doing the correct thing in this case. Here is a fiddle of the interop issue: http://jsfiddle.net/9wsegz9s/ and here is the markup with style inline for discussion:

<body style="text-align: center;">
	<div style="display: inline; position: relative;">
   		 <div id="parent" style="display: block; position: static;">
        			<div id="child" style=" display: block; padding: 5em; background-color: green; position: absolute; ></div>
   		</div>
       	</div>
</body>

Since the wrapper box should be positioned at the center of the viewport due to text-align[2] the next inline box should be starting its positioning there as well. Thoughts?

Thanks!

Greg

[1] http://lists.w3.org/Archives/Public/www-style/2014Jul/0218.html
[2] http://www.w3.org/TR/CSS2/text.html#propdef-text-align
[3] http://dev.w3.org/csswg/css2/visuren.html

Received on Monday, 15 September 2014 23:46:17 UTC