103246 2012-11-26 05:32:02 -0800 Vertical margin percentage values are resolved against logical height, not logical width 2012-12-14 10:41:33 -0800 1 1 1 Unclassified WebKit CSS 525.x (Safari 3.2) All All RESOLVED FIXED http://jsfiddle.net/4HvZN/1/ P2 Normal --- 103576 103579 0 rovanion.luckey betravis betravis phiw2 oldest_to_newest 775373 0 rovanion.luckey 2012-11-26 05:32:02 -0800 Looking at the fallowing example: http://jsfiddle.net/4HvZN/1/ If opened in any other browser but a webkit-based one the .upArrow appears in the middle of the page. As seen in this image with Chrome on the right and Firefox on the left: http://i.imgur.com/26vN6.png This seems to be because webkit-based browsers interpret the percentage as a percentage of the outer elements height. Meanwhile all other browsers interpret the percentage as a percentage of the page width. This behaviour is seen in many implementations of WebKit such as Safari 5.1.7 for Windows, Chrome 23, the Android 2.3 browser, the Safari on the iPhone 4S and so on. 775833 1 betravis 2012-11-26 13:37:00 -0800 I have created a simpler test case here: http://jsfiddle.net/nE6NJ/ The problem appears to be that height is used instead of width when resolving a percentage-based margin-top on an absolutely positioned element. This conflicts with the specification: http://www.w3.org/TR/CSS2/box.html#margin-properties 777420 2 betravis 2012-11-27 17:45:22 -0800 As an addendum, writing-modes specifies this should be calculated based on logical, rather than physical width. http://dev.w3.org/csswg/css3-writing-modes/#dimension-mapping. Going to try to patch this, so renaming bug. Will need to confirm original test case is fixed with patch. 778513 3 phiw2 2012-11-28 17:12:25 -0800 Fwiw, I had filed bug 54613 for this some (long) time ago. 791701 4 betravis 2012-12-14 10:41:33 -0800 Closing, as bug 103576 and bug 103579 have been fixed. Both should be present as of http://trac.webkit.org/changeset/137695