projects / profile / ivi / webkit-efl.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: e61776a)
Unexpected element sizes when mixing inline-table with box-sizing
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 27 Jun 2012 01:41:06 +0000 (01:41 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 27 Jun 2012 01:41:06 +0000 (01:41 +0000)
https://bugs.webkit.org/show_bug.cgi?id=89819

Patch by Kulanthaivel Palanichamy <kulanthaivel@codeaurora.org> on 2012-06-26
Reviewed by Julien Chaffraix.

Source/WebCore:

This change handles box-sizing: border-box property for CSS tables properly.

Test: fast/box-sizing/css-table-with-box-sizing.html

* rendering/RenderTable.cpp:
(WebCore::RenderTable::convertStyleLogicalWidthToComputedWidth):
(WebCore::RenderTable::layout):

LayoutTests:

* fast/box-sizing/css-table-with-box-sizing-expected.txt: Added.
* fast/box-sizing/css-table-with-box-sizing.html: Added.

git-svn-id: http://svn.webkit.org/repository/webkit/trunk@121309 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog patch | blob | history
LayoutTests/fast/box-sizing/css-table-with-box-sizing-expected.txt [new file with mode: 0644] patch | blob
LayoutTests/fast/box-sizing/css-table-with-box-sizing.html [new file with mode: 0644] patch | blob
Source/WebCore/ChangeLog patch | blob | history
Source/WebCore/rendering/RenderTable.cpp patch | blob | history

diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog
index 7ac509d..f5be701 100644 (file)
--- a/LayoutTests/ChangeLog
+++ b/LayoutTests/ChangeLog
@@ -1,3 +1,13 @@
+2012-06-26  Kulanthaivel Palanichamy  <kulanthaivel@codeaurora.org>
+
+        Unexpected element sizes when mixing inline-table with box-sizing
+        https://bugs.webkit.org/show_bug.cgi?id=89819
+
+        Reviewed by Julien Chaffraix.
+
+        * fast/box-sizing/css-table-with-box-sizing-expected.txt: Added.
+        * fast/box-sizing/css-table-with-box-sizing.html: Added.
+
 2012-06-26  Filip Pizlo  <fpizlo@apple.com>
 
         DFG PutByValAlias is too aggressive
diff --git a/LayoutTests/fast/box-sizing/css-table-with-box-sizing-expected.txt b/LayoutTests/fast/box-sizing/css-table-with-box-sizing-expected.txt
new file mode 100644 (file)
index 0000000..781d888
--- /dev/null
+++ b/LayoutTests/fast/box-sizing/css-table-with-box-sizing-expected.txt
@@ -0,0 +1,17 @@
+Test case for bug 89819. This tests CSS 'table' and 'inline-table' with box-sizing.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS document.getElementById("t1").offsetWidth is 120
+PASS document.getElementById("t1").offsetHeight is 120
+PASS document.getElementById("t2").offsetWidth is 120
+PASS document.getElementById("t2").offsetHeight is 120
+PASS document.getElementById("t3").offsetWidth is 140
+PASS document.getElementById("t3").offsetHeight is 140
+PASS document.getElementById("t4").offsetWidth is 140
+PASS document.getElementById("t4").offsetHeight is 140
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
diff --git a/LayoutTests/fast/box-sizing/css-table-with-box-sizing.html b/LayoutTests/fast/box-sizing/css-table-with-box-sizing.html
new file mode 100644 (file)
index 0000000..8dd09b3
--- /dev/null
+++ b/LayoutTests/fast/box-sizing/css-table-with-box-sizing.html
@@ -0,0 +1,53 @@
+<html>
+<head>
+  <style>
+    .test {
+      width:120px;
+      height:120px;
+      border:10px solid black;
+    }
+
+    .border-box {
+      box-sizing:border-box;
+      -moz-box-sizing:border-box;
+    }
+
+       .content-box {
+      box-sizing:content-box;
+      -moz-box-sizing:content-box;
+    }                          
+
+    .css-inline-table {
+      display:inline-table;
+    }
+
+    .css-table {
+      display:table;
+    }
+  </style>
+</head>
+<body>
+<div id="testContent">
+  <p id="t1" class="test css-inline-table border-box">120x120<br>css-inline-table<br>border-box</p>
+  <p id="t2" class="test css-table border-box">120x120<br>css-table<br>border-box</p>
+  <p id="t3" class="test css-inline-table content-box">120x120<br>css-inline-table<br>content-box</p>
+  <p id="t4" class="test css-table content-box">120x120<br>css-table<br>content-box</p>
+</div>
+  <script src="../js/resources/js-test-pre.js"></script>
+  <script>
+    description("Test case for bug 89819. This tests CSS 'table' and 'inline-table' with box-sizing.");
+
+    shouldBe('document.getElementById("t1").offsetWidth', '120');
+    shouldBe('document.getElementById("t1").offsetHeight', '120');
+    shouldBe('document.getElementById("t2").offsetWidth', '120');
+    shouldBe('document.getElementById("t2").offsetHeight', '120');
+    shouldBe('document.getElementById("t3").offsetWidth', '140');
+    shouldBe('document.getElementById("t3").offsetHeight', '140');
+    shouldBe('document.getElementById("t4").offsetWidth', '140');
+    shouldBe('document.getElementById("t4").offsetHeight', '140');
+
+    document.getElementById("testContent").style.display = 'none';
+</script>
+<script src="../js/resources/js-test-post.js"></script>
+</body>
+</html>
diff --git a/Source/WebCore/ChangeLog b/Source/WebCore/ChangeLog
index 6d6c7ac..2b88d23 100755 (executable)
--- a/Source/WebCore/ChangeLog
+++ b/Source/WebCore/ChangeLog
@@ -1,3 +1,18 @@
+2012-06-26  Kulanthaivel Palanichamy  <kulanthaivel@codeaurora.org>
+
+        Unexpected element sizes when mixing inline-table with box-sizing
+        https://bugs.webkit.org/show_bug.cgi?id=89819
+
+        Reviewed by Julien Chaffraix.
+
+        This change handles box-sizing: border-box property for CSS tables properly.
+
+        Test: fast/box-sizing/css-table-with-box-sizing.html
+
+        * rendering/RenderTable.cpp:
+        (WebCore::RenderTable::convertStyleLogicalWidthToComputedWidth):
+        (WebCore::RenderTable::layout):
+
 2012-06-26  Simon Fraser  <simon.fraser@apple.com>
 
         Optimize mappings of simple transforms in RenderGeometryMap
diff --git a/Source/WebCore/rendering/RenderTable.cpp b/Source/WebCore/rendering/RenderTable.cpp
index ab31877..64337bd 100644 (file)
--- a/Source/WebCore/rendering/RenderTable.cpp
+++ b/Source/WebCore/rendering/RenderTable.cpp
@@ -273,7 +273,8 @@ LayoutUnit RenderTable::convertStyleLogicalWidthToComputedWidth(const Length& st
     bool isCSSTable = !node() || !node()->hasTagName(tableTag);
     if (isCSSTable && styleLogicalWidth.isFixed() && styleLogicalWidth.isPositive()) {
         recalcBordersInRowDirection();
-        borders = borderStart() + borderEnd() + (collapseBorders() ? ZERO_LAYOUT_UNIT : paddingStart() + paddingEnd());
+        if (style()->boxSizing() == CONTENT_BOX)
+            borders = borderStart() + borderEnd() + (collapseBorders() ? ZERO_LAYOUT_UNIT : paddingStart() + paddingEnd());
     }
     return minimumValueForLength(styleLogicalWidth, availableWidth, view()) + borders;
 }
@@ -397,7 +398,10 @@ void RenderTable::layout()
     LayoutUnit computedLogicalHeight = 0;
     if (logicalHeightLength.isFixed()) {
         // HTML tables size as though CSS height includes border/padding, CSS tables do not.
-        LayoutUnit borders = node() && node()->hasTagName(tableTag) ? (borderAndPaddingBefore + borderAndPaddingAfter) : ZERO_LAYOUT_UNIT;
+        LayoutUnit borders = ZERO_LAYOUT_UNIT;
+        // FIXME: We cannot apply box-sizing: content-box on <table> which other browsers allow.
+        if ((node() && node()->hasTagName(tableTag)) || style()->boxSizing() == BORDER_BOX)
+            borders = borderAndPaddingBefore + borderAndPaddingAfter;
         computedLogicalHeight = logicalHeightLength.value() - borders;
     } else if (logicalHeightLength.isPercent())
         computedLogicalHeight = computePercentageLogicalHeight(logicalHeightLength);
Domain: Web Framework / Uncategorized;