Bug 117609 - Flex item expands when sibling flex item contains float
Summary: Flex item expands when sibling flex item contains float
Status: RESOLVED WORKSFORME
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: PC Windows XP
: P2 Normal
Assignee: Nobody
URL: http://codepen.io/anon/pen/kgGsq
Keywords:
Depends on:
Blocks:
 
Reported: 2013-06-13 14:10 PDT by Brian Armitage
Modified: 2024-03-05 16:36 PST (History)
3 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Brian Armitage 2013-06-13 14:10:18 PDT 
Found using Chrome 27.0.1453.110 m.

A flex item will continually gain height on resize if:
-its sibling flex item contains a float
-it occurs after its sibling in the source order
-the order of the flex items is changed
-the flex direction of the flex items is changed
-the sibling flex item that contains a float is moved after the flex item

The flex item will also gain height if the above conditions are true and:
-it contains an element with an on-hover box-shadow
-the child element's hover state is activated or deactivated
Comment 1 Ahmad Saleem 2024-03-05 05:36:46 PST 
Wayback Archive Copy - https://web.archive.org/web/20140805095105/https://codepen.io/anon/pen/kgGsq

Changed it to JSFiddle: https://jsfiddle.net/1hf8qd6v/show

> Hover does not seem to have any strange effect even if I change window size using STP189 and it matches Chrome Canary 124.

@Karl & @Sammy - any input, or we should go ahead and close this as 'RESOLVED WONTFIX' (since it was never confirmed).
Comment 2 Karl Dubost 2024-03-05 16:36:51 PST 
Yes it seems to be working on recent versions of Safari.