137693 2014-10-14 07:13:27 -0700 box-sizing border-box not working on input field inside table cell with percentage height 2017-02-22 12:44:37 -0800 1 1 1 Unclassified WebKit Layout and Rendering 528+ (Nightly build) Unspecified Unspecified NEW P2 Critical --- 1 martin.schaus webkit-unassigned pguerrant oldest_to_newest 1041554 0 martin.schaus 2014-10-14 07:13:27 -0700 box-sizing border-box not working on input field inside table cell with percentage height. I think accidently the inner padding-top and padding-left of the input field is added to the table cell, as the effect increases if you set a higher padding value to the input element. Try the below example (Chrome wrong, IE10 ok, FF ok) <!doctype html> <html> <body> <div style="height: 100px; width: 100px"> <input style="box-sizing: border-box; padding 10px; height: 100%; width: 100%" value="correct"> </div> <div style="height: 100px; width: 100px"> <table cellpadding="0" cellspacing="0" style="height: 100%; width: 100%;"> <tbody> <tr> <td class="" style="height: 100%;"> <input type="text" style="height: 100%; width: 100%; box-sizing: border-box; padding: 10px;" value="wrong"> </td> </tr> </tbody> </table> </div> </body> </html> 1041555 1 martin.schaus 2014-10-14 07:14:26 -0700 Sorry, i meant padding-top and padding-bottom 1042745 2 martin.schaus 2014-10-20 00:25:38 -0700 This becomes critical as it worked before and a layout editor relies on this. 1279994 3 302425 pguerrant 2017-02-22 12:43:41 -0800 Created attachment 302425 Test Case 1279995 4 pguerrant 2017-02-22 12:44:37 -0800 I've attached an additional test case that demonstrates the issue using a pair of divs with display table and table-cell with an input inside the table cell using 100% height. It would be really great if we could get this fixed. Thanks! 302425 2017-02-22 12:43:41 -0800 2017-02-22 12:43:41 -0800 Test Case webkit-input-box-model-bug.html text/html 776 pguerrant PCFET0NUWVBFIGh0bWw+CjxodG1sPgo8aGVhZD4KICAgIDx0aXRsZT5XZWJraXQgSW5wdXQgSW4g VGFibGUtQ2VsbCBCb3ggTW9kZWwgQnVnPC90aXRsZT4KCiAgICA8c3R5bGU+CiAgICAgICAgLnRh YmxlIHsKICAgICAgICAgICAgZGlzcGxheTogdGFibGU7CiAgICAgICAgICAgIHdpZHRoOiAxMDBw eDsKICAgICAgICAgICAgaGVpZ2h0OiAxMDBweDsKICAgICAgICB9CgogICAgICAgIC50YWJsZS1j ZWxsIHsKICAgICAgICAgICAgZGlzcGxheTogdGFibGUtY2VsbDsKICAgICAgICB9CgogICAgICAg IC5pbnB1dCB7CiAgICAgICAgICAgIHBhZGRpbmc6IDEwcHg7CiAgICAgICAgICAgIGJvcmRlcjog MDsKICAgICAgICAgICAgaGVpZ2h0OiAxMDAlOwogICAgICAgICAgICBib3gtc2l6aW5nOiBib3Jk ZXItYm94OwogICAgICAgIH0KICAgIDwvc3R5bGU+CjwvaGVhZD4KPGJvZHk+CiAgICAgICAgPGRp diBjbGFzcz0idGFibGUiPgogICAgICAgICAgICA8ZGl2IGNsYXNzPSJ0YWJsZS1jZWxsIj4KICAg ICAgICAgICAgICAgIDxpbnB1dCBpZD0iaW5wdXQiIGNsYXNzPSJpbnB1dCIvPgogICAgICAgICAg ICA8L2Rpdj4KICAgICAgICA8L2Rpdj4KCjxzY3JpcHQ+CiAgICB3aW5kb3cub25sb2FkID0gZnVu Y3Rpb24oKSB7CiAgICAgICAgLy8gT3V0cHV0OiA4MCwgc2hvdWxkIGJlIDEwMAogICAgICAgIGNv bnNvbGUubG9nKGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCdpbnB1dCcpLm9mZnNldEhlaWdodCk7 CiAgICB9Owo8L3NjcmlwdD4KCgo8L2JvZHk+CjwvaHRtbD4=