css - Absolute positioned item in a flex container still gets considered as item in IE & Firefox -
if have multiple elements property justify-content: space-between in flex container , want absolute position 1 of them , remove flex flow, showed here: 
this works in chrome not in ie , firefox absolute positioned element considered 0 width, still in flex flow: 
is there fix keeping layout is?
it turns out takes 3 simple steps
(demo)
1). set left , right margin auto on each child
img { margin-left: auto; margin-right: auto; } 2). set left margin on first child 0
img:nth-child(2) { margin-left: 0; } 3). set right margin on last child 0
img:last-child { margin-right: 0; } if miss of these steps not work properly
this works in firefox , chrome, haven't tested in other browsers.
edit:
thanks @pontiacks
apparently can away adding margin-left: auto img:nth-child(2)
Comments
Post a Comment