Мне было интересно, могу ли я объединить функцию calc() с функцией attr() для достижения чего-то вроде следующего:
<div class="content" data-x="1">
This box should have a width of 100px
</div>
<div class="content" data-x="2">
This box should have a width of 200px
</div>
<div class="content" data-x="3">
This box should have a width of 300px
</div>
CSS
.content{
//Fallback. If no calc is supported, just leave it at 100px
width: 100px;
}
.content[data-x]{
// Multiply the width of the element by the factor of data-x
width: calc(100px * attr(data-x));
}
- Я сделал это неправильно
- Пока не поддерживается
Какая сделка?