CODEWITHSUNDEEP
jqueryjquery-uiwidget
Snailer
Snailer

Reputation: 3839

Why are my jQuery widgets oversized?

As you can see in this fiddle, the datepicker popup is very large in comparison to the one on the Themeroller page for the same theme. This happens with other widgets like dialogs.

If you look at the resources panel you'll see that I've linked to unmodified Google-hosted css and js files, so I haven't done anything to the files.. how can I get my widgets to display nicely like the ones on the Themeroller page?

Upvotes: 3

Views: 302

Answers (2)

Anthony Simmon
Anthony Simmon

Reputation: 1607

Try this :

.ui-widget {
    font-size: 12px;
}

The default font-size of the jquery-ui themeroller is 10px, the .ui-widget CSS property comes with font-size:1.1em, and .ui-datepicker table comes after with font-size:0.9em.

To conclude, the font-size of your jquery-ui widgets depends on your default CSS font-size.

Upvotes: 3

atomman
atomman

Reputation: 2507

Add .ui-widget { font-size: 0.6em; }​ and it should solve your problem.

Upvotes: 1

Related Questions