Forum How do I...?

set size of an element based on attribute value

efra
I am trying to set the width of an element based on the value of a specific attribute. The value type can be pt, px, em or %.
I have trouble with the percent value.


xml:
<img class="symbol" src="sample.jpg" size="20">



css:

img
{
content: attr(src url);
display:inline-block;
}


.symbol[size]
{
width: attr(size, pt)
}



In the
 width: attr(size, pt) 
line, when I change the unit type pt to "%" it doesn't seem to set the width as percentage. I couldn't seem to understand what's going wrong here.



Edited by efra

mikeday
You have to use attr(size, percent).
efra
Fantastic! Thank you. Wow I was spending ages trying to solve it.