Wrong computed style value when block has width and 'margin: auto'

RESOLVED DUPLICATE of bug 381328

Status

()

Core
DOM: CSS Object Model
P3
normal
RESOLVED DUPLICATE of bug 381328
7 years ago
5 years ago

People

(Reporter: skonstantinov, Unassigned)

Tracking

(Depends on: 1 bug)

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment)

301 bytes, text/html
Details
(Reporter)

Description

7 years ago
User-Agent:       Mozilla/5.0 (Windows NT 5.1; rv:2.0b6) Gecko/20100101 Firefox/4.0b6
Build Identifier: Mozilla/5.0 (Windows NT 5.1; rv:2.0b6) Gecko/20100101 Firefox/4.0b6

getComputedStyle(elem, null).getPropertyValue('margin-left') returns '0px'. Opera has the same problem. Webkit returns actual margin size.

Reproducible: Always

Steps to Reproduce:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script>
		window.onload = function () {
			var body = document.getElementsByTagName('body')[0];
			alert(window.getComputedStyle(body, null).getPropertyValue('margin-left'));
		}
    </script>
	<style>
        html
        {
            background: #cff;
        }

        body
        {
            width: 600px;
			height: 600px;
            margin: 0 auto;
            background: #ffc;
        }
	</style>
</head>

<body>
</body>

</html>

Actual Results:  
0px

Expected Results:  
Actual margin size (depends on screen width)
Same behavior on the Beta7 Mozilla/5.0 (Windows NT 5.1; rv:2.0b7) Gecko/20100101 Firefox/4.0b7 

Works with Safari, although there are ways to run this script so that Firefox would echo the expected result for using getComputedStyle(elem, null).getPropertyValue('margin-left') 

You can read more about getStyles behavior in interaction with browsers here: 

http://www.quirksmode.org/dom/getstyles.html 

Still, settings this problem to NEW, although I am not sure we will have a fix through Firefox 4. Juanb, what do you think?
Status: UNCONFIRMED → NEW
Ever confirmed: true

Updated

7 years ago
Component: General → Layout
Product: Firefox → Core
QA Contact: general → layout
I am not sure where this bug would fall under, but I've moved it to layout. Maybe someone in that group could comment or move it to the right bucket.
David, it looks like the used-margin property on <body> just has the value we computed in nsCSSOffsetState::ComputeMargin, and isn't adjusted for the changes that happen in nsHTMLReflowState::CalculateBlockSideMargins (which are what handle auto margins of all sorts for blocks).  Should we be adjusting it for those?
Depends on: 381328
Is there a right answer to that question?  I suppose I could attempt to read tea leaves out of the current specs.
I dunno about "right", but it seems like if we're trying to return used style we should take it into account.

Note that I'm more interested in whether our internal GetUsedMargin() APIs are doing the right thing given how we use them than in how things interact with the brokenness that is getComputedStyle per se.

Comment 6

7 years ago
Created attachment 504611 [details]
testcase

Updated

7 years ago
OS: Windows XP → All
Hardware: x86 → All

Comment 7

6 years ago
This change is being made in webkit as we speak: https://bugs.webkit.org/show_bug.cgi?id=73334

To summarize: http://www.w3.org/TR/css3-values/#stages-examples says that when auto: is specified, the used value should be the positive pixel value, not 0px. It's also clarified again in the CSSOM draft here: http://dev.w3.org/csswg/cssom/#resolved-value

If we are to be following CSS3, Webkit, and IE9/10, the conclusion is: when margin is "auto", getComputedStyle should return the actual used pixel value.

Comment 8

5 years ago
The change has now been made and is live in Webkit and Trident. 
In the meantime, it's been a continuing thorn in jQuery's side. I've had several bug reports about this, and the most recent is:
http://bugs.jquery.com/ticket/11813

Of course, you guys shouldn't do work just to lower jQuery's bug count, but I'm just trying to provide context as to how this effects real world usage.
Component: Layout → DOM: CSS Object Model
Priority: -- → P3
(In reply to Boris Zbarsky (:bz) from comment #3)
> David, it looks like the used-margin property on <body> just has the value
> we computed in nsCSSOffsetState::ComputeMargin, and isn't adjusted for the
> changes that happen in nsHTMLReflowState::CalculateBlockSideMargins (which
> are what handle auto margins of all sorts for blocks).  Should we be
> adjusting it for those?

I think we probably should be.

We need to test this carefully for all values of 'position'.
Status: NEW → RESOLVED
Last Resolved: 5 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 381328
You need to log in before you can comment on or make changes to this bug.