2

I have to use a calculated value for a project. Best would be to use the CSS3 calcattribute. However, this is not supported by Android Webview native browser. Therefore, the easiest way I found was to use jQuery to handle this behavior:

$(element).css('width','100%').css('width','-=100px');

Problem is that this time, I need to use an em value instead of a px value:

$(element).css('width','100%').css('width','-=1em');

This will not work.

Would you have any (simple) solution to handle that problem?

TylerH
  • 20,799
  • 66
  • 75
  • 101
Yako
  • 3,405
  • 9
  • 41
  • 71

2 Answers2

0

The best thing to do is to create a variable for the calculation.

var calc = 0;

Then use that var to output your new value.

calc = $(element).width() - 100;

Write this value to your console to make sure you're ok with the value.

console.log(calc);

Once you're alright with that you should be able to use it in setting the width in css

$(newElement).css({"width" , calc + "px"}); 
//Note: this syntax allows for multiple attributes to be applied to an element.

If you need further assistance then I've created a JSFiddle where you can ..fiddle. http://jsfiddle.net/Fp7qp/

Hope this helps!

0

You're best off doing the math without ems. Unless you declare a font size on the element, 1em will equal 16px.

Tyler Johnson
  • 13
  • 2