display: table; within display: block; forces sibling content to new line
Reported by jsny...@gvusd.org, Oct 20 2013
UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.101 Safari/537.36 Example URL: http://jsbin.com/iBUjAXa/9 Steps to reproduce the problem: 1. Load up http://jsbin.com/iBUjAXa/9 2. Notice that without a fixed width, the table takes up all available space when placed within an inline-block parent. What is the expected behavior? When placed within an inline-block element, the display: table element should not take up the full width of the parent. What went wrong? Element with display: table; goes 100% wide for some reason Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? N/A Does this work in other browsers? Yes Firefox 24 for Mac Chrome version: 30.0.1599.101 Channel: stable OS Version: OS X 10.8.5 Flash Version: Shockwave Flash 11.9 r900 This one is tough honestly, because I don't know what the actual behavior should be here. If the display: table; element has a fixed width, everything is fine and the sizing of elements within that (the input and add-on) make sense. Without any fixed width, what's the "default" or "fallback" width of an input with display: table-cell? I don't know for sure. That said, FF for Mac works just fine with this same markup.
Oct 21 2013,
Oct 25 2013,
it's existing in all channels non regression issue. not sure if its right behavior, triaging to get more input on this.
Dec 29 2014,
Still a problem in Chrome 39.0.2171.93
Jan 9 2015,
Migrate from Cr-Blink-Rendering to Cr-Blink-Layout
Jan 17 2015,
Apr 11 2015,
The problem is very old, but I'm having a lot of headaches to a responsive layout. https://bugs.webkit.org/show_bug.cgi?id=38527#c2 http://stackoverflow.com/questions/21425138/chrome-specific-css-issue-setting-table-cell-to-displayblock
Jul 29 2015,
For the record, Firefox 41's rendering of the example matches Chrome's.
Jul 29 2015,
Safari, IE11, Edge, and Presto also match Chrome's rendering, so this probably isn't an actual bug.
Dec 29 2015,
Intentional and matching other browsers. Marking as WontFix.
Sign in to add a comment