78905 2012-02-17 09:07:41 -0800 Padding and border double-counted against percentage height when a child of a table-cell uses box-sizing:border-box 2022-07-12 16:41:47 -0700 1 1 1 Unclassified WebKit CSS 528+ (Nightly build) Unspecified Unspecified RESOLVED CONFIGURATION CHANGED data:text/html;charset=utf-8,<!DOCTYPE%20html>%0A<table>%0A%20<tr>%0A%20%20<td%20style%3D"width%3A%2050px%3B%20height%3A%2050px%3B%20padding%3A%200%3B%20background%3A%20red%3B">%0A%20%20%20<div%20style%3D"height%3A100%25%3B%20border%3A%205px%20solid%20green%3B%20padding%3A%205px%3B%20background%3A%20green%3B%20box-sizing%3A%20border-box%3B"><%2Fdiv>%0A<%2Ftable>There%20should%20be%20no%20red. P2 Normal --- 1 tabatkins webkit-unassigned bfulgham eric hyatt jchaffraix joethomas manuel oldest_to_newest 559238 0 tabatkins 2012-02-17 09:07:41 -0800 Sorry for the hard-to-parse bug title; it's complicated. When a child of a table cell uses box-sizing:border-box and a percentage height, its border and padding are counted twice when resolving the height. This results in the child being shorter than it's supposed to be. In the reduced testcase (linked from the url), the green child is set to height:100%, so it should fully cover the red table-cell. This bug is making it smaller, so you see red poking through. 559602 1 127666 joethomas 2012-02-17 15:38:08 -0800 Created attachment 127666 ProposedPatch 559608 2 127666 eric 2012-02-17 15:50:35 -0800 Comment on attachment 127666 ProposedPatch View in context: https://bugs.webkit.org/attachment.cgi?id=127666&action=review > Source/WebCore/rendering/RenderBox.cpp:-2151 > - if (includeBorderPadding) { > - // It is necessary to use the border-box to match WinIE's broken > - // box model. This is essential for sizing inside > - // table cells using percentage heights. > - result -= borderAndPaddingLogicalHeight(); > - result = max<LayoutUnit>(0, result); > - } This looks like it was an intentional quirk? This didn't change any other test results? 559633 3 joethomas 2012-02-17 16:21:46 -0800 (In reply to comment #2) > (From update of attachment 127666 [details]) > View in context: https://bugs.webkit.org/attachment.cgi?id=127666&action=review > > > Source/WebCore/rendering/RenderBox.cpp:-2151 > > - if (includeBorderPadding) { > > - // It is necessary to use the border-box to match WinIE's broken > > - // box model. This is essential for sizing inside > > - // table cells using percentage heights. > > - result -= borderAndPaddingLogicalHeight(); > > - result = max<LayoutUnit>(0, result); > > - } > > This looks like it was an intentional quirk? This didn't change any other test results? The comment says that it is done to match with WinIE. But I tested with IE9 and it gives me the same height for table-cell and child element. Looks like IE changed their behavior. Also as per the spec http://www.w3.org/TR/css3-ui/#box-sizing0, if box-sizing is set to content-box, the padding and border of the element are laid out and drawn outside the specified width and height. This cannot be achieved if we subtract padding and border values. Layout test in local machine gives lots of unwanted failures, so I will wait for the bot. It might fail some tests. 559650 4 127666 joethomas 2012-02-17 16:45:38 -0800 Comment on attachment 127666 ProposedPatch Making the patch obsolete as it failed some of the table related tests in local machine. Any thoughts whether this change is desired in webkit as per comment#3 ? I will update the table test cases and resubmit the patch if we decide to go ahead with the change. 571151 5 tabatkins 2012-03-05 16:26:40 -0800 (In reply to comment #4) > (From update of attachment 127666 [details]) > Making the patch obsolete as it failed some of the table related tests in local machine. Any thoughts whether this change is desired in webkit as per comment#3 ? I will update the table test cases and resubmit the patch if we decide to go ahead with the change. Yes, the current behavior is definitely both against-spec and nonsensical. I suspect that the quirk in comment#2 is about old IE's use of the border-box model by default, and it's causing things to now be double-counted in this situation when border-box is explicitly used. Given that IE > 6 switched over to the proper box model, this is likely a quirk that we no longer need to worry about. How old are those lines? 1829768 6 manuel 2022-01-11 04:38:29 -0800 This is still an issue: https://stackoverflow.com/questions/46372207/safari-adding-padding-to-table-cell 1882743 7 bfulgham 2022-07-12 16:41:47 -0700 Safari, Chrome, and Firefox all agree on rendering for this test case. I don't believe there is any remaining compatibility issue. 127666 2012-02-17 15:38:08 -0800 2012-02-17 16:45:38 -0800 ProposedPatch patch text/plain 6251 joethomas SW5kZXg6IFNvdXJjZS9XZWJDb3JlL0NoYW5nZUxvZwo9PT09PT09PT09PT09PT09PT09PT09PT09 PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09Ci0tLSBTb3VyY2UvV2Vi Q29yZS9DaGFuZ2VMb2cJKHJldmlzaW9uIDEwODAyMikKKysrIFNvdXJjZS9XZWJDb3JlL0NoYW5n ZUxvZwkod29ya2luZyBjb3B5KQpAQCAtMSwzICsxLDIwIEBACisyMDEyLTAyLTE3ICBKb2UgVGhv bWFzICA8am9ldGhvbWFzQG1vdG9yb2xhLmNvbT4KKworICAgICAgICBQYWRkaW5nIGFuZCBib3Jk ZXIgZG91YmxlLWNvdW50ZWQgYWdhaW5zdCBwZXJjZW50YWdlIGhlaWdodCB3aGVuIGEgY2hpbGQg b2YgYSB0YWJsZS1jZWxsIHVzZXMgYm94LXNpemluZzpib3JkZXItYm94CisgICAgICAgIGh0dHBz Oi8vYnVncy53ZWJraXQub3JnL3Nob3dfYnVnLmNnaT9pZD03ODkwNQorCisgICAgICAgIFRoZSBo ZWlnaHQgb2YgdGhlIGNoaWxkIGVsZW1lbnQgb2YgYSB0YWJsZS1jZWxsIGlzIGluY29ycmVjdGx5 IGNhbGN1bGF0ZWQgd2hlbiB0aGUgaGVpZ2h0IGlzIHNwZWNpZmllZCBpbiBwZXJjZW50YWdlIHVu aXRzIGFuZAorICAgICAgICBib3gtc2l6aW5nIHByb3BlcnR5IGlzIHNldCB0byBib3JkZXItYm94 LiBQYWRkaW5nIGFuZCBib3JkZXIgdmFsdWVzIGFyZSBzdWJ0cmFjdGVkIHdoaWxlIGNhbGN1YXRp bmcgdGhlIGFjdHVhbCBoZWlnaHQgdGh1cyBtYWtpbmcKKyAgICAgICAgdGhlIGNoaWxkIGVsZW1l bnQgbG9va3Mgc2hvcnRlci4gV2hlbiB0aGUgaGVpZ2h0IG9mIHRoZSBjaGlsZCBlbGVtZW50IGlz IG1lbnRpb25lZCBpbiBmaXhlZCBsZW5ndGgsIHdlYmtpdCBuZXZlciBzdWJ0cmFjdHMgdGhlIGJv cmRlciBhbmQgcGFkZGluZy4KKyAgICAgICAgVGhlIHNhbWUgYmVoYXZpb3VyIHNob3VsZCBiZSBt YWludGFpbmVkIGZvciBwZXJjZW50YWdlIHZhbHVlcyB0b28uCisKKyAgICAgICAgUmV2aWV3ZWQg YnkgTk9CT0RZIChPT1BTISkuCisKKyAgICAgICAgVGVzdDogZmFzdC9ib3gtc2l6aW5nL3RhYmxl LWNlbGwtYm9yZGVyLWJveC5odG1sCisKKyAgICAgICAgKiByZW5kZXJpbmcvUmVuZGVyQm94LmNw cDoKKyAgICAgICAgKFdlYkNvcmU6OlJlbmRlckJveDo6Y29tcHV0ZVBlcmNlbnRhZ2VMb2dpY2Fs SGVpZ2h0KToKKwogMjAxMi0wMi0xNiAgUmF5bW9uZCBMaXUgIDxyYXltb25kLmxpdUBpbnRlbC5j b20+CiAKICAgICAgICAgTGF6eSBpbml0IGZvciBEZWZhdWx0QXVkaW9EZXN0aW5hdGlvbk5vZGUg YW5kIE9mZmxpbmVBdWRpb0Rlc3RpbmF0aW9uTm9kZQpJbmRleDogU291cmNlL1dlYkNvcmUvcmVu ZGVyaW5nL1JlbmRlckJveC5jcHAKPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09 PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PQotLS0gU291cmNlL1dlYkNvcmUvcmVuZGVy aW5nL1JlbmRlckJveC5jcHAJKHJldmlzaW9uIDEwNzk4NykKKysrIFNvdXJjZS9XZWJDb3JlL3Jl bmRlcmluZy9SZW5kZXJCb3guY3BwCSh3b3JraW5nIGNvcHkpCkBAIC0yMDkzLDggKzIwOTMsNiBA QCBMYXlvdXRVbml0IFJlbmRlckJveDo6Y29tcHV0ZVBlcmNlbnRhZ2VMCiAgICAgLy8gaHR0cHM6 Ly9idWdzLndlYmtpdC5vcmcvc2hvd19idWcuY2dpP2lkPTQ2NTAwCiAgICAgYm9vbCBpc1Bvc2l0 aW9uZWRXaXRoU3BlY2lmaWVkSGVpZ2h0ID0gY2ItPmlzUG9zaXRpb25lZCgpICYmICghY2JzdHls ZS0+bG9naWNhbEhlaWdodCgpLmlzQXV0bygpIHx8ICghY2JzdHlsZS0+dG9wKCkuaXNBdXRvKCkg JiYgIWNic3R5bGUtPmJvdHRvbSgpLmlzQXV0bygpKSk7CiAKLSAgICBib29sIGluY2x1ZGVCb3Jk ZXJQYWRkaW5nID0gaXNUYWJsZSgpOwotCiAgICAgLy8gVGFibGUgY2VsbHMgdmlvbGF0ZSB3aGF0 IHRoZSBDU1Mgc3BlYyBzYXlzIHRvIGRvIHdpdGggaGVpZ2h0cy4gIEJhc2ljYWxseSB3ZQogICAg IC8vIGRvbid0IGNhcmUgaWYgdGhlIGNlbGwgc3BlY2lmaWVkIGEgaGVpZ2h0IG9yIG5vdC4gIFdl IGp1c3QgYWx3YXlzIG1ha2Ugb3Vyc2VsdmVzCiAgICAgLy8gYmUgYSBwZXJjZW50YWdlIG9mIHRo ZSBjZWxsJ3MgY3VycmVudCBjb250ZW50IGhlaWdodC4KQEAgLTIxMTQsNyArMjExMiw2IEBAIExh eW91dFVuaXQgUmVuZGVyQm94Ojpjb21wdXRlUGVyY2VudGFnZUwKICAgICAgICAgICAgICAgICBy ZXR1cm4gLTE7CiAgICAgICAgICAgICB9CiAgICAgICAgICAgICByZXN1bHQgPSBjYi0+b3ZlcnJp ZGVIZWlnaHQoKTsKLSAgICAgICAgICAgIGluY2x1ZGVCb3JkZXJQYWRkaW5nID0gdHJ1ZTsKICAg ICAgICAgfQogICAgIH0KICAgICAvLyBPdGhlcndpc2Ugd2Ugb25seSB1c2Ugb3VyIHBlcmNlbnRh Z2UgaGVpZ2h0IGlmIG91ciBjb250YWluaW5nIGJsb2NrIGhhZCBhIHNwZWNpZmllZApAQCAtMjE0 MCwxNiArMjEzNyw5IEBAIExheW91dFVuaXQgUmVuZGVyQm94Ojpjb21wdXRlUGVyY2VudGFnZUwK ICAgICAgICAgcmVzdWx0ID0gY2ItPmNvbXB1dGVDb250ZW50Qm94TG9naWNhbEhlaWdodChjYi0+ YXZhaWxhYmxlTG9naWNhbEhlaWdodCgpKTsKIAogICAgIC8vIEZJWE1FOiBVc2UgPCAwIG9yIHJv dWdobHlFcXVhbHMgd2hlbiB3ZSBtb3ZlIHRvIGZsb2F0LCBzZWUgaHR0cHM6Ly9idWdzLndlYmtp dC5vcmcvc2hvd19idWcuY2dpP2lkPTY2MTQ4Ci0gICAgaWYgKHJlc3VsdCAhPSAtMSkgeworICAg IGlmIChyZXN1bHQgIT0gLTEpCiAgICAgICAgIHJlc3VsdCA9IGhlaWdodC5jYWxjVmFsdWUocmVz dWx0KTsKLSAgICAgICAgaWYgKGluY2x1ZGVCb3JkZXJQYWRkaW5nKSB7Ci0gICAgICAgICAgICAv LyBJdCBpcyBuZWNlc3NhcnkgdG8gdXNlIHRoZSBib3JkZXItYm94IHRvIG1hdGNoIFdpbklFJ3Mg YnJva2VuCi0gICAgICAgICAgICAvLyBib3ggbW9kZWwuICBUaGlzIGlzIGVzc2VudGlhbCBmb3Ig c2l6aW5nIGluc2lkZQotICAgICAgICAgICAgLy8gdGFibGUgY2VsbHMgdXNpbmcgcGVyY2VudGFn ZSBoZWlnaHRzLgotICAgICAgICAgICAgcmVzdWx0IC09IGJvcmRlckFuZFBhZGRpbmdMb2dpY2Fs SGVpZ2h0KCk7Ci0gICAgICAgICAgICByZXN1bHQgPSBtYXg8TGF5b3V0VW5pdD4oMCwgcmVzdWx0 KTsKLSAgICAgICAgfQotICAgIH0KKwogICAgIHJldHVybiByZXN1bHQ7CiB9CiAKSW5kZXg6IExh eW91dFRlc3RzL0NoYW5nZUxvZwo9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09 PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09Ci0tLSBMYXlvdXRUZXN0cy9DaGFuZ2VMb2cJ KHJldmlzaW9uIDEwODAyMikKKysrIExheW91dFRlc3RzL0NoYW5nZUxvZwkod29ya2luZyBjb3B5 KQpAQCAtMSwzICsxLDE4IEBACisyMDEyLTAyLTE3ICBKb2UgVGhvbWFzICA8am9ldGhvbWFzQG1v dG9yb2xhLmNvbT4KKworICAgICAgICBQYWRkaW5nIGFuZCBib3JkZXIgZG91YmxlLWNvdW50ZWQg YWdhaW5zdCBwZXJjZW50YWdlIGhlaWdodCB3aGVuIGEgY2hpbGQgb2YgYSB0YWJsZS1jZWxsIHVz ZXMgYm94LXNpemluZzpib3JkZXItYm94CisgICAgICAgIGh0dHBzOi8vYnVncy53ZWJraXQub3Jn L3Nob3dfYnVnLmNnaT9pZD03ODkwNQorCisgICAgICAgIFRoZSBoZWlnaHQgb2YgdGhlIGNoaWxk IGVsZW1lbnQgb2YgYSB0YWJsZS1jZWxsIGlzIGluY29ycmVjdGx5IGNhbGN1bGF0ZWQgd2hlbiB0 aGUgaGVpZ2h0IGlzIHNwZWNpZmllZCBpbiBwZXJjZW50YWdlIHVuaXRzIGFuZAorICAgICAgICBi b3gtc2l6aW5nIHByb3BlcnR5IGlzIHNldCB0byBib3JkZXItYm94LiBQYWRkaW5nIGFuZCBib3Jk ZXIgdmFsdWVzIGFyZSBzdWJ0cmFjdGVkIHdoaWxlIGNhbGN1YXRpbmcgdGhlIGFjdHVhbCBoZWln aHQgdGh1cyBtYWtpbmcKKyAgICAgICAgdGhlIGNoaWxkIGVsZW1lbnQgbG9va3Mgc2hvcnRlci4g V2hlbiB0aGUgaGVpZ2h0IG9mIHRoZSBjaGlsZCBlbGVtZW50IGlzIG1lbnRpb25lZCBpbiBmaXhl ZCBsZW5ndGgsIHdlYmtpdCBuZXZlciBzdWJ0cmFjdHMgdGhlIGJvcmRlciBhbmQgcGFkZGluZy4K KyAgICAgICAgVGhlIHNhbWUgYmVoYXZpb3VyIHNob3VsZCBiZSBtYWludGFpbmVkIGZvciBwZXJj ZW50YWdlIHZhbHVlcyB0b28uCisKKyAgICAgICAgUmV2aWV3ZWQgYnkgTk9CT0RZIChPT1BTISku CisKKyAgICAgICAgKiBmYXN0L2JveC1zaXppbmcvdGFibGUtY2VsbC1ib3JkZXItYm94LWV4cGVj dGVkLnR4dDogQWRkZWQuCisgICAgICAgICogZmFzdC9ib3gtc2l6aW5nL3RhYmxlLWNlbGwtYm9y ZGVyLWJveC5odG1sOiBBZGRlZC4KKwogMjAxMi0wMi0xNiAgTm9lbCBHb3Jkb24gIDxub2VsLmdv cmRvbkBnbWFpbC5jb20+CiAKICAgICAgICAgW2Nocm9taXVtXSBSZWJhc2VsaW5lIEpQRUcgaW1h Z2UgcmVzdWx0cyBhZnRlciByMTA3Mzg5CkluZGV4OiBMYXlvdXRUZXN0cy9mYXN0L2JveC1zaXpp bmcvdGFibGUtY2VsbC1ib3JkZXItYm94LWV4cGVjdGVkLnR4dAo9PT09PT09PT09PT09PT09PT09 PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09Ci0tLSBMYXlv dXRUZXN0cy9mYXN0L2JveC1zaXppbmcvdGFibGUtY2VsbC1ib3JkZXItYm94LWV4cGVjdGVkLnR4 dAkocmV2aXNpb24gMCkKKysrIExheW91dFRlc3RzL2Zhc3QvYm94LXNpemluZy90YWJsZS1jZWxs LWJvcmRlci1ib3gtZXhwZWN0ZWQudHh0CShyZXZpc2lvbiAwKQpAQCAtMCwwICsxLDE1IEBACitC dWcgNzg5MDU6IFBhZGRpbmcgYW5kIGJvcmRlciBkb3VibGUtY291bnRlZCBhZ2FpbnN0IHBlcmNl bnRhZ2UgaGVpZ2h0IHdoZW4gYSBjaGlsZCBvZiBhIHRhYmxlLWNlbGwgdXNlcyBib3gtc2l6aW5n OmJvcmRlci1ib3gKKworT24gc3VjY2VzcywgeW91IHdpbGwgc2VlIGEgc2VyaWVzIG9mICJQQVNT IiBtZXNzYWdlcywgZm9sbG93ZWQgYnkgIlRFU1QgQ09NUExFVEUiLgorCisKK3RkCitQQVNTIGVs ZW1lbnQub2Zmc2V0V2lkdGggaXMgNTAKK1BBU1MgZWxlbWVudC5vZmZzZXRIZWlnaHQgaXMgNTAK K2Rpdi1kaXNwbGF5LXRhYmxlLWNlbGwKK1BBU1MgZWxlbWVudC5vZmZzZXRXaWR0aCBpcyA1MAor UEFTUyBlbGVtZW50Lm9mZnNldEhlaWdodCBpcyA1MAorUEFTUyBzdWNjZXNzZnVsbHlQYXJzZWQg aXMgdHJ1ZQorCitURVNUIENPTVBMRVRFCisKSW5kZXg6IExheW91dFRlc3RzL2Zhc3QvYm94LXNp emluZy90YWJsZS1jZWxsLWJvcmRlci1ib3guaHRtbAo9PT09PT09PT09PT09PT09PT09PT09PT09 PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09Ci0tLSBMYXlvdXRUZXN0 cy9mYXN0L2JveC1zaXppbmcvdGFibGUtY2VsbC1ib3JkZXItYm94Lmh0bWwJKHJldmlzaW9uIDAp CisrKyBMYXlvdXRUZXN0cy9mYXN0L2JveC1zaXppbmcvdGFibGUtY2VsbC1ib3JkZXItYm94Lmh0 bWwJKHJldmlzaW9uIDApCkBAIC0wLDAgKzEsMzggQEAKKzwhRE9DVFlQRSBodG1sPgorCis8c3R5 bGU+CisudGRTdHlsZSB7CisgIHdpZHRoOiA1MHB4OworICBoZWlnaHQ6IDUwcHg7CisgIHBhZGRp bmc6IDA7CisgIGJhY2tncm91bmQ6IHJlZDsKK30KKworLmRpdlN0eWxlIHsKKyAgaGVpZ2h0OjEw MCU7CisgIGJvcmRlcjogNXB4IHNvbGlkIGdyZWVuOworICBwYWRkaW5nOiA1cHg7CisgIGJhY2tn cm91bmQ6IGdyZWVuOworICBib3gtc2l6aW5nOiBib3JkZXItYm94OworfQorPC9zdHlsZT4KKwor PHRhYmxlPgorPHRyPgorPHRkICBpZD0idGQiIGNsYXNzID0gInRkU3R5bGUiPgorPGRpdiBpZD0i ZGl2LWRpc3BsYXktdGFibGUtY2VsbCIgY2xhc3M9ImRpdlN0eWxlIj48L2Rpdj4KKzwvdGFibGU+ CisKKzxzY3JpcHQgc3JjPSIuLi9qcy9yZXNvdXJjZXMvanMtdGVzdC1wcmUuanMiPjwvc2NyaXB0 PgorPHNjcmlwdD4KK2Rlc2NyaXB0aW9uKCdCdWcgNzg5MDU6IFBhZGRpbmcgYW5kIGJvcmRlciBk b3VibGUtY291bnRlZCBhZ2FpbnN0IHBlcmNlbnRhZ2UgaGVpZ2h0IHdoZW4gYSBjaGlsZCBvZiBh IHRhYmxlLWNlbGwgdXNlcyBib3gtc2l6aW5nOmJvcmRlci1ib3gnKTsKKworWyd0ZCcsICdkaXYt ZGlzcGxheS10YWJsZS1jZWxsJ10uZm9yRWFjaChmdW5jdGlvbiAoaWQpIHsKKyAgZGVidWcoaWQp OworICBlbGVtZW50ID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcignIycgKyBpZCk7CisgIHNob3Vs ZEJlKCdlbGVtZW50Lm9mZnNldFdpZHRoJywgJzUwJyk7CisgIHNob3VsZEJlKCdlbGVtZW50Lm9m ZnNldEhlaWdodCcsICc1MCcpOworfSk7CisKKzwvc2NyaXB0PgorPHNjcmlwdCBzcmM9Ii4uL2pz L3Jlc291cmNlcy9qcy10ZXN0LXBvc3QuanMiPjwvc2NyaXB0Pgo=