Is there "-webkit-flex-shrink" equivalent property in old flexBox spec?
Example here: http://jsfiddle.net/a6weaseh/1/
.row {
width: 300px;
background-color:yellow;
}
.row div:first-child {
width: 100px;
}
.row div:last-child {
background-color: rgba(255,0,255,0.5);
}
.old {
display:-webkit-box;
-webkit-box-orient:horizontal;
}
.new {
display:-webkit-flex;
-webkit-flex-direction:horizontal;
}
.new div:first-child {
-webkit-flex-shrink: 0;
}
.new div:last-child {
-webkit-flex-shrink: 1;
}
<div class="old row">
<div>old</div>
<div>laskjdf ;alksdj fl;aksjdf ;laskjdf ;laskjdf ;alskdjf ;alskdjf a;sldkfj a;sldkjf; asldjfk ;asdfasdfj ;alskdfj ;</div>
</div>
<div class="old row">
<div>old</div>
<div>short</div>
</div>
<br/>
<div class="new row">
<div>new</div>
<div>laskjdf ;alksdj fl;aksjdf ;laskjdf ;laskjdf ;alskdjf ;alskdjf a;sldkfj a;sldkjf; asldjfk ;asdfasdfj ;alskdfj ;</div>
</div>
<div class="new row">
<div>new</div>
<div>short</div>
</div>
The first row is using the old spec, and the second new. I need to make the first row like the second - using old spec.
Thanks