-1

I have a button element and it has 1 character of text in it. The button element is being styled with css and its width and height is a percentage of its parent. How can I (using css) make that 1 character be bigger font size so that it fits exactly inside the button (maintaining aspect ratio). But it shouldn't touch the border, there should be some padding. Does anyone know how to do this? Something like font-size:100%?

Thanks

omega
  • 40,311
  • 81
  • 251
  • 474
  • 1
    Did you see this? http://stackoverflow.com/questions/16056591/font-scaling-based-on-width-of-container – Olivier De Meulder Jun 23 '15 at 00:34
  • I don't believe this can be done for an arbitrary container without setting the font-size to an absolute value (for example in pixels). If the container size is dynamic you'd have to use javascript to calculate the required font size. – Robert Lee Jun 23 '15 at 01:09

1 Answers1

0

Em is used to multiply the font size in the element by it's parent font size
button style="font-size: 1 em;"
This font size will be the same as its parent
button style="font-size: 1.5 em;"
This font size will be the same and half as its parent
button style="font-size: 0.5em;"
This font size will be half the size as its parent
http://www.w3schools.com/css/css_font.asp explains this

Enrique Ornelas
  • 1
  • 1