Fix
bug 427129 / 377664: When displacing blocks that don't interact with floats around floats, displace the border box rather than the margin box. Fix
bug 427782: Simultaneously, only displace when the width actually won't go down to an amount that fits (i.e., if it will go to an amount smaller than the intrinsic minimum width, let it).
b=427129 r+sr=roc a=schrep
--- a/layout/generic/nsBlockFrame.cpp
+++ b/layout/generic/nsBlockFrame.cpp
@@ -1765,28 +1765,30 @@ nsBlockFrame::ReflowDirtyLines(nsBlockRe
// This really sucks, but we have to look inside any blocks that have clear
// elements inside them.
// XXX what can we do smarter here?
if (!line->IsDirty() && line->IsBlock() &&
(line->mFirstChild->GetStateBits() & NS_BLOCK_HAS_CLEAR_CHILDREN)) {
line->MarkDirty();
}
- nscoord replacedWidth = 0;
+ ReplacedElementWidthToClear replacedWidthStruct;
+ ReplacedElementWidthToClear *replacedWidth = nsnull;
if (line->IsBlock() &&
!nsBlockFrame::BlockCanIntersectFloats(line->mFirstChild)) {
- replacedWidth =
+ replacedWidthStruct =
nsBlockFrame::WidthToClearPastFloats(aState, line->mFirstChild);
+ replacedWidth = &replacedWidthStruct;
}
// We have to reflow the line if it's a block whose clearance
// might have changed, so detect that.
if (!line->IsDirty() &&
(line->GetBreakTypeBefore() != NS_STYLE_CLEAR_NONE ||
- replacedWidth != 0)) {
+ replacedWidth)) {
nscoord curY = aState.mY;
// See where we would be after applying any clearance due to
// BRs.
if (inlineFloatBreakType != NS_STYLE_CLEAR_NONE) {
curY = aState.ClearFloats(curY, inlineFloatBreakType);
}
nscoord newY =
@@ -2789,20 +2791,22 @@ nsBlockFrame::ReflowBlockFrame(nsBlockRe
// returned PR_FALSE (in which case the top-margin-root set our
// clearance flag). Otherwise clear it now. We'll set it later on
// ourselves if necessary.
aLine->ClearHasClearance();
}
PRBool treatWithClearance = aLine->HasClearance();
PRBool mightClearFloats = breakType != NS_STYLE_CLEAR_NONE;
- nscoord replacedWidth = 0;
+ ReplacedElementWidthToClear replacedWidthStruct;
+ ReplacedElementWidthToClear *replacedWidth = nsnull;
if (!nsBlockFrame::BlockCanIntersectFloats(frame)) {
mightClearFloats = PR_TRUE;
- replacedWidth = nsBlockFrame::WidthToClearPastFloats(aState, frame);
+ replacedWidthStruct = nsBlockFrame::WidthToClearPastFloats(aState, frame);
+ replacedWidth = &replacedWidthStruct;
}
// If our top margin was counted as part of some parents top-margin
// collapse and we are being speculatively reflowed assuming this
// frame DID NOT need clearance, then we need to check that
// assumption.
if (!treatWithClearance && !applyTopMargin && mightClearFloats &&
aState.mReflowState.mDiscoveredClearance) {
@@ -2940,17 +2944,17 @@ nsBlockFrame::ReflowBlockFrame(nsBlockRe
// Compute the available space for the block
aState.GetAvailableSpace();
#ifdef REALLY_NOISY_REFLOW
printf("setting line %p isImpacted to %s\n", aLine.get(), aState.IsImpactedByFloat()?"true":"false");
#endif
PRBool isImpacted = aState.IsImpactedByFloat() ? PR_TRUE : PR_FALSE;
aLine->SetLineIsImpactedByFloat(isImpacted);
nsRect availSpace;
- aState.ComputeBlockAvailSpace(frame, display, availSpace);
+ aState.ComputeBlockAvailSpace(frame, display, replacedWidth, availSpace);
// Now put the Y coordinate back to the top of the top-margin +
// clearance, and flow the block.
aState.mY -= topMargin;
availSpace.y -= topMargin;
if (NS_UNCONSTRAINEDSIZE != availSpace.height) {
availSpace.height += topMargin;
}
@@ -6762,67 +6766,119 @@ nsBlockFrame::BlockNeedsSpaceManager(nsI
PRBool
nsBlockFrame::BlockCanIntersectFloats(nsIFrame* aFrame)
{
return aFrame->IsFrameOfType(nsIFrame::eBlockFrame) &&
!aFrame->IsFrameOfType(nsIFrame::eReplaced) &&
!(aFrame->GetStateBits() & NS_BLOCK_SPACE_MGR);
}
-static nscoord
-OneWidthToClearPastFloats(nsPresContext* aPresContext,
- const nsHTMLReflowState& aParentReflowState,
- nscoord aCBWidth,
- nsIFrame* aFrame)
+// Note that this width can vary based on the vertical position.
+// However, the cases where it varies are the cases where the width fits
+// in the available space given, which means that variation shouldn't
+// matter.
+/* static */
+nsBlockFrame::ReplacedElementWidthToClear
+nsBlockFrame::WidthToClearPastFloats(nsBlockReflowState& aState,
+ nsIFrame* aFrame)
{
- // We need to compute percent widths, since intrinsic width
- // computation doesn't.
- if (aFrame->GetStylePosition()->mWidth.GetUnit() == eStyleUnit_Percent) {
+ aState.GetAvailableSpace();
+ nscoord leftOffset, rightOffset;
+ nsCSSOffsetState offsetState(aFrame, aState.mReflowState.rendContext,
+ aState.mContentArea.width);
+
+ ReplacedElementWidthToClear result;
+ // A table outer frame is an exception in that it is a block child
+ // that is not a containing block for its children.
+ if (aFrame->GetType() == nsGkAtoms::tableOuterFrame) {
+ nsIFrame *innerTable = aFrame->GetFirstChild(nsnull);
+ nsIFrame *caption = aFrame->GetFirstChild(nsGkAtoms::captionList);
+
+ nsMargin tableMargin, captionMargin;
+ {
+ nsCSSOffsetState tableOS(innerTable, aState.mReflowState.rendContext,
+ aState.mContentArea.width);
+ tableMargin = tableOS.mComputedMargin;
+ }
+
+ if (caption) {
+ nsCSSOffsetState captionOS(caption, aState.mReflowState.rendContext,
+ aState.mContentArea.width);
+ captionMargin = captionOS.mComputedMargin;
+ }
+
+ PRUint8 captionSide;
+ if (!caption ||
+ ((captionSide = caption->GetStyleTableBorder()->mCaptionSide)
+ == NS_STYLE_CAPTION_SIDE_TOP ||
+ captionSide == NS_STYLE_CAPTION_SIDE_BOTTOM)) {
+ result.marginLeft = tableMargin.left;
+ result.marginRight = tableMargin.right;
+ } else if (captionSide == NS_STYLE_CAPTION_SIDE_TOP_OUTSIDE ||
+ captionSide == NS_STYLE_CAPTION_SIDE_BOTTOM_OUTSIDE) {
+ // FIXME: This doesn't treat the caption and table independently,
+ // since we adjust by only the smaller margin, and the table outer
+ // frame doesn't know about it.
+ result.marginLeft = PR_MIN(tableMargin.left, captionMargin.left);
+ result.marginRight = PR_MIN(tableMargin.right, captionMargin.right);
+ } else {
+ NS_ASSERTION(captionSide == NS_STYLE_CAPTION_SIDE_LEFT ||
+ captionSide == NS_STYLE_CAPTION_SIDE_RIGHT,
+ "unexpected caption-side");
+ if (captionSide == NS_STYLE_CAPTION_SIDE_LEFT) {
+ result.marginLeft = captionMargin.left;
+ result.marginRight = tableMargin.right;
+ } else {
+ result.marginLeft = tableMargin.left;
+ result.marginRight = captionMargin.right;
+ }
+ }
+
+ aState.ComputeReplacedBlockOffsetsForFloats(aFrame, leftOffset, rightOffset,
+ &result);
+
+ nscoord availWidth = aState.mContentArea.width - leftOffset - rightOffset
+ + result.marginLeft + result.marginRight;
+ // Force the outer frame to shrink-wrap (otherwise it just sizes to
+ // the available width unconditionally).
+ result.borderBoxWidth =
+ aFrame->ComputeSize(aState.mReflowState.rendContext,
+ nsSize(aState.mContentArea.width,
+ NS_UNCONSTRAINEDSIZE),
+ availWidth,
+ nsSize(offsetState.mComputedMargin.LeftRight(),
+ offsetState.mComputedMargin.TopBottom()),
+ nsSize(offsetState.mComputedBorderPadding.LeftRight() -
+ offsetState.mComputedPadding.LeftRight(),
+ offsetState.mComputedBorderPadding.TopBottom() -
+ offsetState.mComputedPadding.TopBottom()),
+ nsSize(offsetState.mComputedPadding.LeftRight(),
+ offsetState.mComputedPadding.TopBottom()),
+ PR_TRUE).width +
+ offsetState.mComputedBorderPadding.LeftRight() -
+ (result.marginLeft + result.marginRight);
+ } else {
+ aState.ComputeReplacedBlockOffsetsForFloats(aFrame, leftOffset, rightOffset);
+ nscoord availWidth = aState.mContentArea.width - leftOffset - rightOffset;
+
+ // We actually don't want the min width here; see bug 427782; we only
+ // want to displace if the width won't compute to a value small enough
+ // to fit.
// All we really need here is the result of ComputeSize, and we
// could *almost* get that from an nsCSSOffsetState, except for the
// last argument.
- nsSize availSpace(aCBWidth, NS_UNCONSTRAINEDSIZE);
- nsHTMLReflowState reflowState(aPresContext, aParentReflowState,
+ nsSize availSpace(availWidth, NS_UNCONSTRAINEDSIZE);
+ nsHTMLReflowState reflowState(aState.mPresContext, aState.mReflowState,
aFrame, availSpace);
- return reflowState.ComputedWidth();
- }
-
- return nsLayoutUtils::IntrinsicForContainer(aParentReflowState.rendContext,
- aFrame,
- nsLayoutUtils::MIN_WIDTH);
-}
-
-/* static */
-nscoord
-nsBlockFrame::WidthToClearPastFloats(nsBlockReflowState& aState,
- nsIFrame* aFrame)
-{
- nscoord result;
- // A table outer frame is an exception in that it is a block child
- // that is not a containing block for its children.
- if (aFrame->GetType() == nsGkAtoms::tableOuterFrame) {
- nsSize availSpace(aState.mContentArea.width, NS_UNCONSTRAINEDSIZE);
- nsHTMLReflowState outerRS(aState.mPresContext, aState.mReflowState,
- aFrame, availSpace);
- nsIFrame *innerTable = aFrame->GetFirstChild(nsnull);
- nsIFrame *caption = aFrame->GetFirstChild(nsGkAtoms::captionList);
- result = OneWidthToClearPastFloats(aState.mPresContext, outerRS,
- aState.mContentArea.width, innerTable);
- if (caption) {
- nscoord captionWidth = OneWidthToClearPastFloats(aState.mPresContext,
- outerRS, aState.mContentArea.width, caption);
- PRUint8 captionSide = caption->GetStyleTableBorder()->mCaptionSide;
- if (captionSide == NS_SIDE_TOP || captionSide == NS_SIDE_BOTTOM)
- result = PR_MAX(result, captionWidth);
- else
- result += captionWidth;
- }
- } else {
- result = OneWidthToClearPastFloats(aState.mPresContext,
- aState.mReflowState, aState.mContentArea.width, aFrame);
+ result.borderBoxWidth = reflowState.ComputedWidth() +
+ reflowState.mComputedBorderPadding.LeftRight();
+ // Use the margins from offsetState rather than reflowState so that
+ // they aren't reduced by ignoring margins in overconstrained cases.
+ result.marginLeft = offsetState.mComputedMargin.left;
+ result.marginRight = offsetState.mComputedMargin.right;
}
return result;
}
/* static */
nsBlockFrame*
nsBlockFrame::GetNearestAncestorBlock(nsIFrame* aCandidate)
{
--- a/layout/generic/nsBlockFrame.h
+++ b/layout/generic/nsBlockFrame.h
@@ -294,18 +294,23 @@ public:
* be a block frame, but if it's not, the result will be false.)
*/
static PRBool BlockCanIntersectFloats(nsIFrame* aFrame);
/**
* Returns the width that needs to be cleared past floats for blocks
* that cannot intersect floats.
*/
- static nscoord WidthToClearPastFloats(nsBlockReflowState& aState,
- nsIFrame* aFrame);
+ struct ReplacedElementWidthToClear {
+ nscoord marginLeft, borderBoxWidth, marginRight;
+ nscoord MarginBoxWidth() const
+ { return marginLeft + borderBoxWidth + marginRight; }
+ };
+ static ReplacedElementWidthToClear
+ WidthToClearPastFloats(nsBlockReflowState& aState, nsIFrame* aFrame);
/**
* Walks up the frame tree, starting with aCandidate, and returns the first
* block frame that it encounters.
*/
static nsBlockFrame* GetNearestAncestorBlock(nsIFrame* aCandidate);
protected:
--- a/layout/generic/nsBlockReflowState.cpp
+++ b/layout/generic/nsBlockReflowState.cpp
@@ -193,22 +193,75 @@ nsBlockReflowState::NewLineBox(nsIFrame*
void
nsBlockReflowState::FreeLineBox(nsLineBox* aLine)
{
if (aLine) {
aLine->Destroy(mPresContext->PresShell());
}
}
+void
+nsBlockReflowState::ComputeReplacedBlockOffsetsForFloats(nsIFrame* aFrame,
+ nscoord& aLeftResult,
+ nscoord& aRightResult,
+ nsBlockFrame::
+ ReplacedElementWidthToClear
+ *aReplacedWidth)
+{
+ // The frame is clueless about the space manager and therefore we
+ // only give it free space. An example is a table frame - the
+ // tables do not flow around floats.
+ // However, we can let its margins intersect floats.
+ NS_ASSERTION(mAvailSpaceRect.x >= 0, "bad avail space rect x");
+ NS_ASSERTION(mAvailSpaceRect.width == 0 ||
+ mAvailSpaceRect.XMost() <= mContentArea.width,
+ "bad avail space rect width");
+
+ nscoord leftOffset, rightOffset;
+ if (mAvailSpaceRect.width == mContentArea.width) {
+ // We don't need to compute margins when there are no floats around.
+ leftOffset = 0;
+ rightOffset = 0;
+ } else {
+ // We pass in aReplacedWidth to make handling outer table frames
+ // work correctly. For outer table frames, we need to subtract off
+ // the margin that's going to be at the edge of them, since we're
+ // dealing with margin that it's really the child's responsibility
+ // to place.
+ nsCSSOffsetState os(aFrame, mReflowState.rendContext, mContentArea.width);
+ NS_ASSERTION(!aReplacedWidth ||
+ aFrame->GetType() == nsGkAtoms::tableOuterFrame ||
+ (aReplacedWidth->marginLeft == os.mComputedMargin.left &&
+ aReplacedWidth->marginRight == os.mComputedMargin.right),
+ "unexpected aReplacedWidth");
+
+ nscoord leftFloatXOffset = mAvailSpaceRect.x;
+ leftOffset = PR_MAX(leftFloatXOffset, os.mComputedMargin.left) -
+ (aReplacedWidth ? aReplacedWidth->marginLeft
+ : os.mComputedMargin.left);
+ leftOffset = PR_MAX(leftOffset, 0); // in case of negative margin
+ nscoord rightFloatXOffset = mContentArea.width - mAvailSpaceRect.XMost();
+ rightOffset = PR_MAX(rightFloatXOffset, os.mComputedMargin.right) -
+ (aReplacedWidth ? aReplacedWidth->marginRight
+ : os.mComputedMargin.right);
+ rightOffset = PR_MAX(rightOffset, 0); // in case of negative margin
+ }
+ aLeftResult = leftOffset;
+ aRightResult = rightOffset;
+}
+
// Compute the amount of available space for reflowing a block frame
// at the current Y coordinate. This method assumes that
// GetAvailableSpace has already been called.
void
nsBlockReflowState::ComputeBlockAvailSpace(nsIFrame* aFrame,
const nsStyleDisplay* aDisplay,
+ nsBlockFrame::
+ ReplacedElementWidthToClear
+ *aReplacedWidth,
nsRect& aResult)
{
#ifdef REALLY_NOISY_REFLOW
printf("CBAS frame=%p has float count %d\n", aFrame, mBand.GetFloatCount());
mBand.List();
#endif
aResult.y = mY;
aResult.height = GetFlag(BRS_UNCONSTRAINEDHEIGHT)
@@ -227,17 +280,19 @@ nsBlockReflowState::ComputeBlockAvailSpa
// things to become extremely narrow when they'd fit quite well a
// little bit lower). Should the else be a quirk or something that
// applies to a specific set of frame classes and no new ones?
// If we did that, then for those frames where the condition below is
// true but nsBlockFrame::BlockCanIntersectFloats is false,
// nsBlockFrame::WidthToClearPastFloats would need to use the
// shrink-wrap formula, max(MIN_WIDTH, min(avail width, PREF_WIDTH))
// rather than just using MIN_WIDTH.
- if (nsBlockFrame::BlockCanIntersectFloats(aFrame)) {
+ NS_ASSERTION(nsBlockFrame::BlockCanIntersectFloats(aFrame) == !aReplacedWidth,
+ "unexpected replaced width");
+ if (!aReplacedWidth) {
if (mBand.GetFloatCount()) {
// Use the float-edge property to determine how the child block
// will interact with the float.
const nsStyleBorder* borderStyle = aFrame->GetStyleBorder();
switch (borderStyle->mFloatEdge) {
default:
case NS_STYLE_FLOAT_EDGE_CONTENT: // content and only content does runaround of floats
// The child block will flow around the float. Therefore
@@ -295,21 +350,21 @@ nsBlockReflowState::ComputeBlockAvailSpa
// Since there are no floats present the float-edge property
// doesn't matter therefore give the block element all of the
// available space since it will flow around the float itself.
aResult.x = borderPadding.left;
aResult.width = mContentArea.width;
}
}
else {
- // The frame is clueless about the space manager and therefore we
- // only give it free space. An example is a table frame - the
- // tables do not flow around floats.
- aResult.x = mAvailSpaceRect.x + borderPadding.left;
- aResult.width = mAvailSpaceRect.width;
+ nscoord leftOffset, rightOffset;
+ ComputeReplacedBlockOffsetsForFloats(aFrame, leftOffset, rightOffset,
+ aReplacedWidth);
+ aResult.x = borderPadding.left + leftOffset;
+ aResult.width = mContentArea.width - leftOffset - rightOffset;
}
#ifdef REALLY_NOISY_REFLOW
printf(" CBAS: result %d %d %d %d\n", aResult.x, aResult.y, aResult.width, aResult.height);
#endif
}
void
@@ -1045,17 +1100,17 @@ nsBlockReflowState::PlaceBelowCurrentLin
}
fc = fc->Next();
}
return PR_TRUE;
}
nscoord
nsBlockReflowState::ClearFloats(nscoord aY, PRUint8 aBreakType,
- nscoord aReplacedWidth)
+ nsBlockFrame::ReplacedElementWidthToClear *aReplacedWidth)
{
#ifdef DEBUG
if (nsBlockFrame::gNoisyReflow) {
nsFrame::IndentBy(stdout, nsBlockFrame::gNoiseIndent);
printf("clear floats: in: aY=%d(%d)\n",
aY, aY - BorderPadding().top);
}
#endif
@@ -1068,20 +1123,26 @@ nsBlockReflowState::ClearFloats(nscoord
const nsMargin& bp = BorderPadding();
nscoord newY = aY;
if (aBreakType != NS_STYLE_CLEAR_NONE) {
newY = bp.top + mSpaceManager->ClearFloats(newY - bp.top, aBreakType);
}
- if (aReplacedWidth > 0) {
+ if (aReplacedWidth) {
for (;;) {
GetAvailableSpace(newY, PR_FALSE);
- if (mAvailSpaceRect.width >= aReplacedWidth || mBand.GetFloatCount() == 0) {
+ if (mBand.GetFloatCount() == 0 ||
+ PR_MAX(mAvailSpaceRect.x, aReplacedWidth->marginLeft) +
+ aReplacedWidth->borderBoxWidth +
+ PR_MAX(mContentArea.width -
+ PR_MIN(mContentArea.width, mAvailSpaceRect.XMost()),
+ aReplacedWidth->marginRight) <=
+ mContentArea.width) {
break;
}
// See the analogous code for inlines in nsBlockFrame::DoReflowInlineFrames
if (mAvailSpaceRect.height > 0) {
// See if there's room in the next band.
newY += mAvailSpaceRect.height;
} else {
if (mReflowState.availableHeight != NS_UNCONSTRAINEDSIZE) {
--- a/layout/generic/nsBlockReflowState.h
+++ b/layout/generic/nsBlockReflowState.h
@@ -41,19 +41,17 @@
/* state used in reflow of block frames */
#ifndef nsBlockReflowState_h__
#define nsBlockReflowState_h__
#include "nsBlockBandData.h"
#include "nsLineBox.h"
#include "nsFrameList.h"
-#include "nsContainerFrame.h"
-
-class nsBlockFrame;
+#include "nsBlockFrame.h"
// block reflow state flags
#define BRS_UNCONSTRAINEDHEIGHT 0x00000001
#define BRS_ISTOPMARGINROOT 0x00000002 // Is this frame a root for top/bottom margin collapsing?
#define BRS_ISBOTTOMMARGINROOT 0x00000004
#define BRS_APPLYTOPMARGIN 0x00000008 // See ShouldApplyTopMargin
#define BRS_ISFIRSTINFLOW 0x00000010
// Set when mLineAdjacentToTop is valid
@@ -106,17 +104,18 @@ public:
PRBool* aIsLeftFloat,
nsReflowStatus& aReflowStatus,
PRBool aForceFit);
PRBool PlaceBelowCurrentLineFloats(nsFloatCacheFreeList& aFloats, PRBool aForceFit);
// Returns the first coordinate >= aY that clears the
// floats indicated by aBreakType and has enough width between floats
// (or no floats remaining) to accomodate aReplacedWidth.
- nscoord ClearFloats(nscoord aY, PRUint8 aBreakType, nscoord aReplacedWidth = 0);
+ nscoord ClearFloats(nscoord aY, PRUint8 aBreakType,
+ nsBlockFrame::ReplacedElementWidthToClear *aReplacedWidth = nsnull);
PRBool IsAdjacentWithTop() const {
return mY ==
((mFlags & BRS_ISFIRSTINFLOW) ? mReflowState.mComputedBorderPadding.top : 0);
}
/**
* Adjusts the border/padding to return 0 for the top if
@@ -136,18 +135,28 @@ public:
// XXX maybe we should do the same adjustment for continuations here
const nsMargin& Margin() const {
return mReflowState.mComputedMargin;
}
// Reconstruct the previous bottom margin that goes above |aLine|.
void ReconstructMarginAbove(nsLineList::iterator aLine);
+ // Caller must have called GetAvailableSpace for the current mY
+ void ComputeReplacedBlockOffsetsForFloats(nsIFrame* aFrame,
+ nscoord& aLeftResult,
+ nscoord& aRightResult,
+ nsBlockFrame::ReplacedElementWidthToClear
+ *aReplacedWidth = nsnull);
+
+ // Caller must have called GetAvailableSpace for the current mY
void ComputeBlockAvailSpace(nsIFrame* aFrame,
const nsStyleDisplay* aDisplay,
+ nsBlockFrame::ReplacedElementWidthToClear
+ *aReplacedWidth,
nsRect& aResult);
protected:
void RecoverFloats(nsLineList::iterator aLine, nscoord aDeltaY);
public:
void RecoverStateFrom(nsLineList::iterator aLine, nscoord aDeltaY);
--- a/layout/reftests/bugs/134706-3-left-scrollframe-ref.html
+++ b/layout/reftests/bugs/134706-3-left-scrollframe-ref.html
@@ -2,17 +2,15 @@
<html lang="en-US">
<head>
<title>Testcase, bug 134706</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
</head>
<body>
-<div style="width: 300px; height: 150px; background: aqua">
+<div style="width: 300px; height: 100px; background: aqua">
<div style="float:left; background:blue; width: 100px; height: 100px"></div>
- <div style="float:left; background:yellow; width: 300px; height: 50px">
- <div style="background:purple; width: 250px; height: 50px"></div>
- </div>
+ <div style="float:left; background:purple; width: 200px; height: 50px"></div>
</div>
</body>
</html>
--- a/layout/reftests/bugs/134706-3-right-scrollframe-ref.html
+++ b/layout/reftests/bugs/134706-3-right-scrollframe-ref.html
@@ -2,17 +2,15 @@
<html lang="en-US">
<head>
<title>Testcase, bug 134706</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
</head>
<body>
-<div style="width: 300px; height: 150px; background: aqua">
+<div style="width: 300px; height: 100px; background: aqua">
<div style="float:right; background:blue; width: 100px; height: 100px"></div>
- <div style="float:left; background:yellow; width: 300px; height: 50px">
- <div style="background:purple; width: 250px; height: 50px"></div>
- </div>
+ <div style="float:left; background:purple; width: 200px; height: 50px"></div>
</div>
</body>
</html>
--- a/layout/reftests/bugs/134706-4-ref.html
+++ b/layout/reftests/bugs/134706-4-ref.html
@@ -29,39 +29,31 @@
<div style="float:right; background:blue; width: 100px; height: 20px"></div>
<div style="float:right; background:silver; width: 100px; height: 6px"></div>
<div style="float:left; width: 150px; height: 10px; background: purple"></div>
</div>
<div style="width: 300px; height: 20px; background: aqua"><tr><td>
<div style="float:left; background:blue; width: 100px; height: 20px"></div>
<div style="float:left; background:silver; width: 100px; height: 6px"></div>
- <div style="float:left; width: 200px; height: 10px; background: yellow">
- <div style="float:left; width: 150px; height: 10px; background: purple"></div>
- </div>
+ <div style="float:left; width: 100px; height: 10px; background: purple"></div>
</div>
<div style="width: 300px; height: 20px; background: aqua"><tr><td>
<div style="float:left; background:blue; width: 100px; height: 20px"></div>
<div style="float:right; background:silver; width: 100px; height: 6px"></div>
- <div style="float:left; width: 200px; height: 10px; background: yellow">
- <div style="float:left; width: 150px; height: 10px; background: purple"></div>
- </div>
+ <div style="float:left; width: 100px; height: 10px; background: purple"></div>
</div>
<div style="width: 300px; height: 20px; background: aqua"><tr><td>
<div style="float:right; background:blue; width: 100px; height: 20px"></div>
<div style="float:left; background:silver; width: 100px; height: 6px"></div>
- <div style="float:left; width: 200px; height: 10px; background: yellow">
- <div style="float:left; width: 150px; height: 10px; background: purple"></div>
- </div>
+ <div style="float:left; width: 100px; height: 10px; background: purple"></div>
</div>
<div style="width: 300px; height: 20px; background: aqua"><tr><td>
<div style="float:right; background:blue; width: 100px; height: 20px"></div>
<div style="float:right; background:silver; width: 100px; height: 6px"></div>
- <div style="float:left; width: 200px; height: 10px; background: yellow">
- <div style="float:left; width: 150px; height: 10px; background: purple"></div>
- </div>
+ <div style="float:left; width: 100px; height: 10px; background: purple"></div>
</div>
</body>
</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/bugs/427129-image.html
@@ -0,0 +1,190 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en-US">
+<head>
+ <title>Reftest, bug 427129</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+ <style type="text/css">
+
+ html, body { margin: 0; }
+
+ .contain {
+ background: aqua; color: black;
+ height: 10px; margin: 2px 50px;
+ padding-top: 0.1px; /* needed for some reason (XXX WHY?) */
+ }
+
+ .fl, .fr { height: 5px; }
+ .fl { float: left; width: 56px; }
+ .fr { float: right; width: 73px; }
+
+ .t { display: block; background: blue; height: 5px; width: 85px;
+ border-left: 1px solid blue; padding-left: 2px;
+ padding-right: 4px; border-right: 8px solid blue; }
+
+ </style>
+</head>
+<body>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t">
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin-left: 30px">
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin-left: 56px">
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin-left: 73px">
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin-left: 100px">
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin-left: auto">
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin-left: auto; margin-right: 30px">
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin-left: auto; margin-right: 56px">
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin-left: auto; margin-right: 73px">
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin-left: auto; margin-right: 100px">
+</div>
+
+<!-- Remember that the extra end-edge margin gets ignored -->
+<div style="width: 300px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="width: 56px">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 15px; width: 56px">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="width: 57px">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 15px; width: 57px">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 15px 0 56px; width: 56px">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 15px 0 57px; width: 56px">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 73px 0 15px; width: 56px">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 74px 0 15px; width: 56px">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="width: 28%">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 15px; width: 28%">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="width: 29%">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 15px; width: 29%">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 15px 0 56px; width: 28%">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 15px 0 57px; width: 28%">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 73px 0 15px; width: 28%">
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <img src="solidblue2.png" class="t" style="margin: 0 74px 0 15px; width: 28%">
+ </div>
+</div>
+
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/bugs/427129-ref.html
@@ -0,0 +1,136 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en-US">
+<head>
+ <title>Reftest, bug 427129</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+ <style type="text/css">
+
+ html, body { margin: 0; }
+
+ .contain {
+ background: aqua; color: black;
+ height: 10px; margin: 2px 50px;
+ padding-top: 0.1px; /* needed for some reason (XXX WHY?) */
+ }
+
+ .t { background: blue; height: 5px; width: 100px; }
+
+ </style>
+</head>
+<body>
+
+<div class="contain">
+ <div class="t" style="margin-left: 56px"></div>
+</div>
+
+<div class="contain">
+ <div class="t" style="margin-left: 56px"></div>
+</div>
+
+<div class="contain">
+ <div class="t" style="margin-left: 56px"></div>
+</div>
+
+<div class="contain">
+ <div class="t" style="margin-left: 73px"></div>
+</div>
+
+<div class="contain">
+ <div class="t" style="margin-left: 100px"></div>
+</div>
+
+<div class="contain">
+ <div class="t" style="margin-left: auto; margin-right: 73px"></div>
+</div>
+
+<div class="contain">
+ <div class="t" style="margin-left: auto; margin-right: 73px"></div>
+</div>
+
+<div class="contain">
+ <div class="t" style="margin-left: auto; margin-right: 73px"></div>
+</div>
+
+<div class="contain">
+ <div class="t" style="margin-left: auto; margin-right: 73px"></div>
+</div>
+
+<div class="contain">
+ <div class="t" style="margin-left: auto; margin-right: 100px"></div>
+</div>
+
+<!-- Remember that the extra end-edge margin gets ignored -->
+<div style="width: 300px">
+ <div class="contain">
+ <div class="t" style="margin-left: 56px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-left: 56px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-top: 5px; width: 72px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-top: 5px; margin-left: 15px; width: 72px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-left: 56px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-top: 5px; margin-left: 57px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-left: 56px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <!-- maybe we should ignore margin-right here? It's hard to do
+ for tables, though. -->
+ <div class="t" style="margin-top: 5px; margin-left: 15px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-left: 56px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-left: 56px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-top: 5px; width: 73px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-top: 5px; margin-left: 15px; width: 73px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-left: 56px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-top: 5px; margin-left: 57px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="t" style="margin-left: 56px; width: 71px"></div>
+ </div>
+
+ <div class="contain">
+ <!-- maybe we should ignore margin-right here? It's hard to do
+ for tables, though. -->
+ <div class="t" style="margin-top: 5px; margin-left: 15px; width: 71px"></div>
+ </div>
+</div>
+
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/bugs/427129-scrollframe.html
@@ -0,0 +1,190 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en-US">
+<head>
+ <title>Reftest, bug 427129</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+ <style type="text/css">
+
+ html, body { margin: 0; }
+
+ .contain {
+ background: aqua; color: black;
+ height: 10px; margin: 2px 50px;
+ padding-top: 0.1px; /* needed for some reason (XXX WHY?) */
+ }
+
+ .fl, .fr { height: 5px; }
+ .fl { float: left; width: 56px; }
+ .fr { float: right; width: 73px; }
+
+ .t { overflow: hidden; background: blue; height: 5px; width: 85px;
+ border-left: 1px solid blue; padding-left: 2px;
+ padding-right: 4px; border-right: 8px solid blue; }
+
+ </style>
+</head>
+<body>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t"></div>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin-left: 30px"></div>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin-left: 56px"></div>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin-left: 73px"></div>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin-left: 100px"></div>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin-left: auto"></div>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin-left: auto; margin-right: 30px"></div>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin-left: auto; margin-right: 56px"></div>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin-left: auto; margin-right: 73px"></div>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin-left: auto; margin-right: 100px"></div>
+</div>
+
+<!-- Remember that the extra end-edge margin gets ignored -->
+<div style="width: 300px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="width: 56px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 15px; width: 56px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="width: 57px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 15px; width: 57px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 15px 0 56px; width: 56px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 15px 0 57px; width: 56px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 73px 0 15px; width: 56px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 74px 0 15px; width: 56px"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="width: 28%"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 15px; width: 28%"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="width: 29%"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 15px; width: 29%"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 15px 0 56px; width: 28%"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 15px 0 57px; width: 28%"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 73px 0 15px; width: 28%"></div>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <div class="t" style="margin: 0 74px 0 15px; width: 28%"></div>
+ </div>
+</div>
+
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/bugs/427129-table-caption-ref.html
@@ -0,0 +1,711 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en-US">
+<head>
+ <title>Reftest, bug 427129</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+ <style type="text/css">
+
+ html, body { margin: 0; }
+
+ .contain {
+ background: aqua; color: black;
+ height: 4px; margin: 1px 50px;
+ padding-top: 0.1px; /* needed for some reason (XXX WHY?) */
+ }
+
+ div.pushed { height: 2px; }
+ div.t { background: blue; height: 1px; width: 100px; }
+ div.caption { background: purple; height: 1px; width: 100px; }
+ div.side { display: inline-block; vertical-align: top; }
+
+ </style>
+</head>
+<body>
+
+<!--
+
+ WARNING: Both this test and the reference are constructed to test
+ our current behavior, which is far from optimal in a number of cases.
+ Fixing the test to test better behavior is encouraged when such
+ behavior is implemented.
+
+ To test the behavior under resizing, every test in this page is
+ repeated three times, once in a container one pixel above the
+ transition width, once at the transition width (just fitting), and
+ once in a container a pixel below the transition width.
+
+-->
+
+<div style="width: 335px">
+ <div class="contain">
+ <div class="t" style="margin-left: 56px"></div>
+ <div class="caption" style="margin-left: 116px"></div>
+ </div>
+</div>
+
+<div style="width: 334px">
+ <div class="contain">
+ <div class="t" style="margin-left: 56px"></div>
+ <div class="caption" style="margin-left: 116px"></div>
+ </div>
+</div>
+
+<div style="width: 333px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 55px"></div>
+ <div class="caption" style="margin-left: 115px"></div>
+ </div>
+</div>
+
+<div style="width: 334px">
+ <div class="contain">
+ <div class="caption" style="margin-left: 116px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 333px">
+ <div class="contain">
+ <div class="caption" style="margin-left: 116px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 332px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="caption" style="margin-left: 116px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 334px">
+ <div class="contain">
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 117px"></div>
+ </div>
+</div>
+
+<div style="width: 333px">
+ <div class="contain">
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 117px"></div>
+ </div>
+</div>
+
+<div style="width: 332px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 117px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="caption" style="margin-left: 56px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="caption" style="margin-left: 56px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 328px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain">
+ <div class="t" style="margin-left: 56px"></div>
+ <div class="caption" style="margin-left: 57px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="t" style="margin-left: 56px"></div>
+ <div class="caption" style="margin-left: 57px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 55px"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain">
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ <div class="caption" style="margin-left: 55px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="caption" style="margin-left: 56px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="caption" style="margin-left: 56px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 328px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="caption" style="margin-left: 55px"></div>
+ <div class="t" style="margin-left: 55px"></div>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain">
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain">
+ <div class="caption" style="margin-left: 57px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="caption" style="margin-left: 57px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="caption" style="margin-left: 57px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="side caption" style="margin-left: 56px"></div
+ ><div class="side t" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="side caption" style="margin-left: 56px"></div
+ ><div class="side t" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 655px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="side caption" style="margin-left: 55px"></div
+ ><div class="side t" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="side caption" style="margin-left: 56px"></div
+ ><div class="side t" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="side caption" style="margin-left: 56px"></div
+ ><div class="side t" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 655px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="side caption" style="margin-left: 56px"></div
+ ><div class="side t" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 658px">
+ <div class="contain">
+ <div class="side caption" style="margin-left: 57px"></div
+ ><div class="side t" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="side caption" style="margin-left: 57px"></div
+ ><div class="side t" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="side caption" style="margin-left: 57px"></div
+ ><div class="side t" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="side t" style="margin-left: 56px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="side t" style="margin-left: 56px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 655px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="side t" style="margin-left: 55px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="side t" style="margin-left: 56px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="side t" style="margin-left: 56px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 655px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="side t" style="margin-left: 56px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 658px">
+ <div class="contain">
+ <div class="side t" style="margin-left: 57px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="side t" style="margin-left: 57px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="pushed"></div>
+ <div class="side t" style="margin-left: 57px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 338px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 65px"></div>
+ <div class="caption" style="margin-left: -15px"></div>
+ </div>
+</div>
+
+<div style="width: 337px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 64px"></div>
+ <div class="caption" style="margin-left: -16px"></div>
+ </div>
+</div>
+
+<div style="width: 336px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 64px"></div>
+ <div class="caption" style="margin-left: -16px"></div>
+ </div>
+</div>
+
+<div style="width: 337px">
+ <div class="contain rtl">
+ <div class="caption" style="margin-left: -16px"></div>
+ <div class="t" style="margin-left: 64px"></div>
+ </div>
+</div>
+
+<div style="width: 336px">
+ <div class="contain rtl">
+ <div class="caption" style="margin-left: -17px"></div>
+ <div class="t" style="margin-left: 63px"></div>
+ </div>
+</div>
+
+<div style="width: 335px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="caption" style="margin-left: -18px"></div>
+ <div class="t" style="margin-left: 62px"></div>
+ </div>
+</div>
+
+<div style="width: 337px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 63px"></div>
+ <div class="caption" style="margin-left: -17px"></div>
+ </div>
+</div>
+
+<div style="width: 336px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 62px"></div>
+ <div class="caption" style="margin-left: -18px"></div>
+ </div>
+</div>
+
+<div style="width: 335px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 61px"></div>
+ <div class="caption" style="margin-left: -19px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="caption" style="margin-left: 57px"></div>
+ <div class="t" style="margin-left: 57px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="caption" style="margin-left: 56px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 328px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="caption" style="margin-left: 55px"></div>
+ <div class="t" style="margin-left: 55px"></div>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 58px"></div>
+ <div class="caption" style="margin-left: 57px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 58px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 56px"></div>
+ <div class="caption" style="margin-left: 57px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ <div class="caption" style="margin-left: 57px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="caption" style="margin-left: 57px"></div>
+ <div class="t" style="margin-left: 57px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="caption" style="margin-left: 56px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 328px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 57px"></div>
+ <div class="caption" style="margin-left: 58px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="t" style="margin-left: 56px"></div>
+ <div class="caption" style="margin-left: 57px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="t" style="margin-left: 55px"></div>
+ <div class="caption" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain rtl">
+ <div class="caption" style="margin-left: 57px"></div>
+ <div class="t" style="margin-left: 58px"></div>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="caption" style="margin-left: 56px"></div>
+ <div class="t" style="margin-left: 57px"></div>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="caption" style="margin-left: 55px"></div>
+ <div class="t" style="margin-left: 56px"></div>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <!-- margins showing up in the wrong places? -->
+ <div class="side caption" style="margin-left: 100px"></div
+ ><div class="side t" style="margin-left: 72px"></div>
+ </div>
+</div>
+
+<div style="width: 672px">
+ <div class="contain rtl">
+ <!-- margins showing up in the wrong places? -->
+ <div class="side caption" style="margin-left: 100px"></div
+ ><div class="side t" style="margin-left: 72px"></div>
+ </div>
+</div>
+
+<div style="width: 671px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <!-- margins showing up in the wrong places? -->
+ <div class="side caption" style="margin-left: 100px"></div
+ ><div class="side t" style="margin-left: 72px"></div>
+ </div>
+</div>
+
+<div style="width: 674px">
+ <div class="contain rtl">
+ <!-- margins showing up in the wrong places? -->
+ <div class="side caption" style="margin-left: 100px"></div
+ ><div class="side t" style="margin-left: 73px"></div>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <!-- margins showing up in the wrong places? -->
+ <div class="side caption" style="margin-left: 100px"></div
+ ><div class="side t" style="margin-left: 73px"></div>
+ </div>
+</div>
+
+<div style="width: 672px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <!-- margins showing up in the wrong places? -->
+ <div class="side caption" style="margin-left: 100px"></div
+ ><div class="side t" style="margin-left: 73px"></div>
+ </div>
+</div>
+
+<div style="width: 675px">
+ <div class="contain rtl">
+ <!-- margins showing up in the wrong places? -->
+ <div class="side caption" style="margin-left: 100px"></div
+ ><div class="side t" style="margin-left: 74px"></div>
+ </div>
+</div>
+
+<div style="width: 674px">
+ <div class="contain rtl">
+ <!-- margins showing up in the wrong places? -->
+ <div class="side caption" style="margin-left: 100px"></div
+ ><div class="side t" style="margin-left: 74px"></div>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <!-- margins showing up in the wrong places? -->
+ <div class="side caption" style="margin-left: 100px"></div
+ ><div class="side t" style="margin-left: 74px"></div>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="side t" style="margin-left: 101px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 672px">
+ <div class="contain rtl">
+ <div class="side t" style="margin-left: 100px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 671px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="side t" style="margin-left: 99px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 674px">
+ <div class="contain rtl">
+ <div class="side t" style="margin-left: 101px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="side t" style="margin-left: 100px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 672px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="side t" style="margin-left: 99px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 675px">
+ <div class="contain rtl">
+ <div class="side t" style="margin-left: 101px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 674px">
+ <div class="contain rtl">
+ <div class="side t" style="margin-left: 100px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="pushed"></div>
+ <div class="side t" style="margin-left: 99px"></div
+ ><div class="side caption" style="margin-left: 100px"></div>
+ </div>
+</div>
+
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/bugs/427129-table-caption.html
@@ -0,0 +1,1040 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en-US">
+<head>
+ <title>Reftest, bug 427129</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+ <style type="text/css">
+
+ html, body { margin: 0; }
+
+ .rtl { direction: rtl; }
+
+ .contain {
+ background: aqua; color: black;
+ height: 4px; margin: 1px 50px;
+ padding-top: 0.1px; /* needed for some reason (XXX WHY?) */
+ }
+
+ .fl, .fr { height: 2px; }
+ .fl { float: left; width: 56px; }
+ .fr { float: right; width: 73px; }
+
+ .t { background: blue; height: 1px; width: 100px; border-spacing: 0; }
+ .t caption { background: purple; height: 1px; width: 100px; }
+ .t td { padding: 0; }
+
+ </style>
+</head>
+<body>
+
+<!--
+
+ WARNING: Both this test and the reference are constructed to test
+ our current behavior, which is far from optimal in a number of cases.
+ Fixing the test to test better behavior is encouraged when such
+ behavior is implemented. In particular:
+ * making the effect of the caption's side margin make sense for 'top'
+ and 'bottom' captions
+ * making 'left' and 'right' captions behave sensibly
+
+ To test the behavior under resizing, every test in this page is
+ repeated three times, once in a container one pixel above the
+ transition width, once at the transition width (just fitting), and
+ once in a container a pixel below the transition width.
+
+-->
+
+<div style="width: 335px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 55px; caption-side: bottom">
+ <caption style="margin: 0 15px 0 60px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 334px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 55px; caption-side: bottom">
+ <caption style="margin: 0 15px 0 60px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 333px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 55px; caption-side: bottom">
+ <caption style="margin: 0 15px 0 60px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 334px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: top">
+ <caption style="margin: 0 15px 0 60px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 333px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: top">
+ <caption style="margin: 0 15px 0 60px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 332px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: top">
+ <caption style="margin: 0 15px 0 60px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 334px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 57px; caption-side: bottom">
+ <caption style="margin: 0 15px 0 60px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 333px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 57px; caption-side: bottom">
+ <caption style="margin: 0 15px 0 60px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 332px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 57px; caption-side: bottom">
+ <caption style="margin: 0 15px 0 60px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: top-outside">
+ <caption style="margin: 0 15px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: top-outside">
+ <caption style="margin: 0 15px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 328px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: top-outside">
+ <caption style="margin: 0 15px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 55px; caption-side: bottom-outside">
+ <caption style="margin: 0 15px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 55px; caption-side: bottom-outside">
+ <caption style="margin: 0 15px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 55px; caption-side: bottom-outside">
+ <caption style="margin: 0 15px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: bottom-outside">
+ <caption style="margin: 0 15px 0 55px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: bottom-outside">
+ <caption style="margin: 0 15px 0 55px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: bottom-outside">
+ <caption style="margin: 0 15px 0 55px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 55px; caption-side: top-outside">
+ <caption style="margin: 0 15px 0 55px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 55px; caption-side: top-outside">
+ <caption style="margin: 0 15px 0 55px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 328px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 55px; caption-side: top-outside">
+ <caption style="margin: 0 15px 0 55px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 57px; caption-side: bottom-outside">
+ <caption style="margin: 0 15px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 57px; caption-side: bottom-outside">
+ <caption style="margin: 0 15px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 57px; caption-side: bottom-outside">
+ <caption style="margin: 0 15px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: top-outside">
+ <caption style="margin: 0 15px 0 57px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: top-outside">
+ <caption style="margin: 0 15px 0 57px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; caption-side: top-outside">
+ <caption style="margin: 0 15px 0 57px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 100px 0 55px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 100px 0 55px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 655px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 100px 0 55px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 100px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 100px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 655px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 100px 0 56px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 658px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 100px 0 57px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 100px 0 57px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 100px 0 57px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 55px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 55px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 655px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 55px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 56px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 56px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 655px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 56px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 658px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 57px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 657px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 57px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 656px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 57px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 338px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 15px; caption-side: bottom">
+ <caption style="margin: 0 80px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 337px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 15px; caption-side: bottom">
+ <caption style="margin: 0 80px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 336px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 15px; caption-side: bottom">
+ <caption style="margin: 0 80px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 337px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: top">
+ <caption style="margin: 0 80px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 336px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: top">
+ <caption style="margin: 0 80px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 335px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: top">
+ <caption style="margin: 0 80px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 337px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 15px; caption-side: bottom">
+ <caption style="margin: 0 80px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 336px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 15px; caption-side: bottom">
+ <caption style="margin: 0 80px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 335px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 15px; caption-side: bottom">
+ <caption style="margin: 0 80px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: top-outside">
+ <caption style="margin: 0 73px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: top-outside">
+ <caption style="margin: 0 73px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 328px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: top-outside">
+ <caption style="margin: 0 73px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 15px; caption-side: bottom-outside">
+ <caption style="margin: 0 73px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 15px; caption-side: bottom-outside">
+ <caption style="margin: 0 73px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 15px; caption-side: bottom-outside">
+ <caption style="margin: 0 73px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: bottom-outside">
+ <caption style="margin: 0 72px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: bottom-outside">
+ <caption style="margin: 0 72px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: bottom-outside">
+ <caption style="margin: 0 72px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 15px; caption-side: top-outside">
+ <caption style="margin: 0 72px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 15px; caption-side: top-outside">
+ <caption style="margin: 0 72px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 328px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 15px; caption-side: top-outside">
+ <caption style="margin: 0 72px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 15px; caption-side: bottom-outside">
+ <caption style="margin: 0 73px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 15px; caption-side: bottom-outside">
+ <caption style="margin: 0 73px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 15px; caption-side: bottom-outside">
+ <caption style="margin: 0 73px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 331px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: top-outside">
+ <caption style="margin: 0 74px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 330px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: top-outside">
+ <caption style="margin: 0 74px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 329px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; caption-side: top-outside">
+ <caption style="margin: 0 74px 0 15px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 72px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 672px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 72px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 671px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 72px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 674px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 73px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 73px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 672px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 73px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 675px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 74px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 674px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 74px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 100px 0 100px; caption-side: left">
+ <caption style="margin: 0 74px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 100px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 672px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 100px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 671px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 72px 0 100px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 674px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 100px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 100px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 672px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 100px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 675px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 100px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 674px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 100px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+<div style="width: 673px">
+ <div class="contain rtl">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 100px; caption-side: right">
+ <caption style="margin: 0 100px 0 100px"></caption>
+ <tr><td></td></tr>
+ </table>
+ </div>
+</div>
+
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/bugs/427129-table.html
@@ -0,0 +1,192 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en-US">
+<head>
+ <title>Reftest, bug 427129</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+ <style type="text/css">
+
+ html, body { margin: 0; }
+
+ .contain {
+ background: aqua; color: black;
+ height: 10px; margin: 2px 50px;
+ padding-top: 0.1px; /* needed for some reason (XXX WHY?) */
+ }
+
+ .fl, .fr { height: 5px; }
+ .fl { float: left; width: 56px; }
+ .fr { float: right; width: 73px; }
+
+ /* tables default to border-box sizing */
+ .t { background: blue; height: 5px; width: 100px; border-spacing: 0;
+ border-left: 1px solid blue; padding-left: 2px;
+ padding-right: 4px; border-right: 8px solid blue; }
+ .t td { padding: 0; }
+
+ </style>
+</head>
+<body>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t"><tr><td></td></tr></table>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin-left: 30px"><tr><td></td></tr></table>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin-left: 56px"><tr><td></td></tr></table>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin-left: 73px"><tr><td></td></tr></table>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin-left: 100px"><tr><td></td></tr></table>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin-left: auto"><tr><td></td></tr></table>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin-left: auto; margin-right: 30px"><tr><td></td></tr></table>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin-left: auto; margin-right: 56px"><tr><td></td></tr></table>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin-left: auto; margin-right: 73px"><tr><td></td></tr></table>
+</div>
+
+<div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin-left: auto; margin-right: 100px"><tr><td></td></tr></table>
+</div>
+
+<!-- Remember that the extra end-edge margin gets ignored -->
+<div style="width: 300px">
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="width: 71px"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px; width: 71px"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="width: 72px"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px; width: 72px"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; width: 71px"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 57px; width: 71px"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; width: 71px"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 15px; width: 71px"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="width: 35.5%"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px; width: 35.5%"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="width: 36.5%"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px; width: 36.5%"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 56px; width: 35.5%"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 15px 0 57px; width: 35.5%"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 73px 0 15px; width: 35.5%"><tr><td></td></tr></table>
+ </div>
+
+ <div class="contain">
+ <div class="fl"></div>
+ <div class="fr"></div>
+ <table class="t" style="margin: 0 74px 0 15px; width: 35.5%"><tr><td></td></tr></table>
+ </div>
+</div>
+
+</body>
+</html>
--- a/layout/reftests/bugs/reftest.list
+++ b/layout/reftests/bugs/reftest.list
@@ -793,9 +793,13 @@ fails-if(MOZ_WIDGET_TOOLKIT=="gtk2") ==
== 424236-10.html 424236-10-ref.html
== 424434-1.html 424434-1-ref.html
== 424631-1.html 424631-1-ref.html
== 424710-1.html 424710-1-ref.html
== 425972-1.html 425972-1-ref.html
== 425972-2.html 425972-2-ref.html
!= 425972-1.html 425972-2.html
!= 427017-1.xhtml about:blank # crash test (needs reftest-print)
+== 427129-scrollframe.html 427129-ref.html
+== 427129-table.html 427129-ref.html
+== 427129-image.html 427129-ref.html
+== 427129-table-caption.html 427129-table-caption-ref.html
== 427370-1.html 427370-1-ref.html
new file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..9998c98b96089d6aefa11febd60f90795a81e434
GIT binary patch
literal 82
zc%17D@N?(olHy`uVBq!ia0vp^j3CUx1SBVv2j2s6ii6yp7}lMWc?sn3c)B=-a9mGL
cNch3ez{t$VaC6n&%|LMmPgg&ebxsLQ0FMR}GXMYp