How can I get current fontSize of link-element?

Question

How can I get fontSize of element in px or pt? Or can I use any other methods? I need to make the size of <a href="...">MAKE ME BIGGER</a> bigger on 130%, 140%, N% from current size.

Answer 1

Perhaps the information at this website can help you out. It will allow you to use px or pt to specify a new font size.

Answer 2

If you use the em unit instead this is relative to the current size, see; http://www.w3schools.com/css/css_units.asp

1em is equal to the current font size. 2em means 2 times the size of the current font. E.g., if an element is displayed with a font of 12 pt, then '2em' is 24 pt. The 'em' is a very useful unit in CSS, since it can adapt automatically to the font that the reader uses

[EDIT] Your label is part of the anchor, does it have to be? What about if you construct the page with;

<label class="fixed-font">
  <a class="scaled-font">BIGGER TEXT</a> 
  Normal Sized Text
</label>

Then created the styles with scaled-font a child selector of fixed-font e.g.

label.fixed-font { 
  font-size:12px 
} 
label.fixed-font a.scaled-font 
{ 
  font-size:1.6em; 
}

Answer 3

to make the size of text element bigger, insert all content of element in the child span and set to this span style="font-size: N%":

function makeBigger(lnk){
  var Span = document.createElement('span')
  for(var i = lnk.childNodes.length - 1; i >=0; i--){
    Span.insertBefore(lnk.childNodes[i], Span.firstChild)
  }
  Span.style.fontSize = '120%'
  lnk.appendChild(Span)
}

of course, it doesn't work in the constructions like this:

<a ... >MAKE ME BIGGER <label class="some_class_with_fixed_font_size">but not me</label></a>