Go here and click on the check availability in the sidebar(don’t enter any date).
Now, try to pick a date from within the sidebar and also try to pick a date from within the page. You’ll see that the one on the page – which is in an iFrame – is much larger.
Anyone know what might be causing this?
You need to use the same font and font-size to have the datepickers to be the same size.
The JQuery UI is measured in ’em’, which is based on the size of the font.
from http://www.w3schools.com/cssref/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”