Is this a possible browser quirk with safari and column wrapped flexbox's? -
compare how flexbox looks in chrome or firefox , how looks in safari. chrome & firefox correct. in safari, it's acting minimum height of flex box calculated based on bottom position of last flex item, whereas in other browsers seems calculate minimum height of flex box based upon flex item takes on minimum. can find out if code wrong or confirm bug? view snippet in full page see. html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } .wrapper { margin: 0 auto; max-width: 984px; } .container { margin: 0 80px; padding: 30px 0; } h1 { margin: 0; } .top { position: relative; display: flex; flex-direction: column; max-height: 800px; flex-wrap: wrap; } .prod-header { order: 3; width: 49%; padding-left: 30px; } .prod-header img { width: 100%; } .my-slider { order: 1; width: 51%; padding-right: 30px; } .my-slider img { width: 100%; } .prod-info { order: 4; wid...