How to randomize float (for opacity) and percentage (for position) in SASS? https://codepen.io/anon/pen/XZMXMM
<div class="parent">
<div class="child"></div>
<div class="child"></div>
</div>
For position I am only able to randomize by px
, if I put %
it doesn't work.
.child {
position: absolute;
top: 50px;
background: #333;
width: 15px;
height: 15px;
}
@for $i from 0 to 15 {
.parent .child:nth-child(#{$i}) {
// Instead of px this should randomize by percent up to 100% (20%, 45%, 77%...)
left: random(100) + px;
// This should randomize opacity (0.5, 0.7, 0.9, ...)
opacity: 1;
}
}