why jquery's ui.css files's font-sizes are bigger than normal?

Question

Hi all,

Im looking at jqueries tabs, datepicker etc and see that font-sizes of the classes added to elements are like 1.1em, 1em which seems big in the page. Why did they do this like that? What is the purpose? http://jquery-ui.googlecode.com/svn/tags/latest/themes/base/jquery.ui.theme.css

Answer 1

This is the default style that someone determined, you are free to change it though using ThemeRoller. Just go under font settings on the left and adjust to what you want.

Answer 2

I don't understand why the default fonts are so much larger than the fonts in the demo. I realize that I can change it, but I can't change the font size on the version that Google is hosting.

Answer 3

em is a relativ size and depends on the next fixed font-size up the dom tree. when there is no fixed font-size it defaults to 16px.

so when you change your own css like this

body {
    font-size: 12px;
}

1em means 12px, 2em means 24px and so on.