Element with height 100% does not fill container
Reported by
aidantwo...@gmail.com,
Feb 3 2017
|
||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36 Example URL: https://www.aidanwoods.com/blog/secure-headers-for-php Steps to reproduce the problem: 1. visit URL 2. Scroll down page 3. Right content (class="content-wrapper side") should grow to fill containing element (class="container") What is the expected behavior? Right content grows to fill containing element What went wrong? Right content does not grow to fill containing element Does it occur on multiple sites: N/A Is it a problem with a plugin? N/A Did this work before? Yes Last known (to me) Chrome 55.* version Does this work in other browsers? Yes Chrome version: 56.0.2924.87 Channel: stable OS Version: OS X 10.12.3 Flash Version: Shockwave Flash 24.0 r0 Works in FF and Safari
,
Feb 3 2017
Bisect: 438649 (good) - 438658 (bad) https://chromium.googlesource.com/chromium/src/+log/6e043304..b9779013?pretty=fuller Suspecting r438652 "Percent height border-box content should get correct height in percent height cells" Originally appeared in 57.0.2952.0, later back-merged into v56: https://crbug.com/669867#c12 Repro note: the browser window should be wide enough for the sidebar to show up in full.
,
Feb 6 2017
,
Feb 6 2017
Able to reproduce the issue on windows 7, Linux Ubuntu 14.04 and Mac 10.12.2 using chrome version 56.0.2924.87 and canary 58.0.3004.0. this is regression issue broken in M56.Please find the bisect information as below Narrow Bisect:: Good :: 56.0.2924.36 ---- (build revision 433059) Bad :: 56.0.2924.37 --- (build revision 433059) Unable to provide the tool bisect as the good and bad are from branch builds hence providing manual CL from omahaproxy. Change Log:: https://chromium.googlesource.com/chromium/src/+log/56.0.2924.36..56.0.2924.37?pretty=fuller&n=10000 Possible suspect:: https://codereview.chromium.org/2535173006 robhogan@ Could you please look into this issue if it is related to your change,else please help us in finding the appropriate owner for this issue. Thanks,
,
Feb 6 2017
Your page is relying on quirks mode behaviour which we don't support anymore. If you use <!DOCTYPE html> you should see that Chrome renders consistently with other browsers.
,
Feb 7 2017
I've updated the test page to include `<!DOCTYPE html>`. The issue is *still* present. Just as an aside, is `height: 100%` really considered a quirk?
,
Feb 7 2017
Right, and it's also present in FF, because I believe it's the expected behaviour per the css tables spec. The behaviour you expect is 'quirks mode' in that it will only render that way on some browsers if you leave out the <!DOCTYPE html> that says to the browser - render this page per the spec. Our focus is to render per the spec rather than try to support older 'quirky' behaviour so I think you will need to look at finding another way to achieve the effect you want. I'll take a closer look at your page later in the week to make sure I'm not missing anything but that's my analysis for now!
,
Feb 8 2017
I see, it seems that I can get the desired behaviour by changing the element I want to grow to be `display: table-cell` Would be interested in reading that part of the spec, if you've got a link handy? If the height property is being ignored deliberately, should Chrome be producing a warning (rather than listing the height property as-if it had being applied?) e.g. (attached)
,
Feb 18 2017
Oh sorry, didn't reply. Take a look at https://drafts.csswg.org/css-tables-3/#row-layout which builds on https://drafts.csswg.org/css2/visudet.html. |
||||
►
Sign in to add a comment |
||||
Comment 1 Deleted