html - css label absolute position, but still taken into account for parent width -
i have flexbox layout div containing label last item. has position: absolute
. possible still make parent div expand contain label?
<div class='container'> <div class="item">flex1</div> <div class="item">flex2</div> <div class="item no-flex"> <div> <label>nfdfesrsawe</label> <div> </div> </div> .container{ width: 100%; display: flex; background-color: red; justify-content: space-between } .item { border: solid black 1px; flex: 1; } .no-flex { flex: 0 } label { position: absolute; }
https://codepen.io/anon/pen/yozvwx
edit: simplified example:
<div class='container'> <label>make container fit around me, please</label> <div> .container{ background-color: red; } label { position: absolute; }
i need work because absolute positioning defined framework (vuetify) , can try fix via css , not html changes
in short no.
anything other flex child
not respond flex
when make position:absolute
force block
not flex
.
check answer have gave before regarding flex box's
Comments
Post a Comment