How to get similar style as JQuery UI website itself

StackOverflow https://stackoverflow.com/questions/19673586

  •  01-07-2022
  •  | 
  •  

Question

I use jQuery UI and the "Smooth Default" CSS theme. However, everything looks bigger in my website compared to the jQuery UI website. For example, take the buttons here: http://jqueryui.com/button/

In my website they look much bigger with more padding and larger font. Do you know how I can imitate the jQuery UI website?

Was it helpful?

Solution

If you inspect the jQuery UI website using your browser's web inspector, you can see that in the <iframe> containing the buttons you mention, the following CSS is applied:

body {
    font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif";
    /* This is making the text smaller */
    font-size: 62.5%;
}

In other words, they modified the CSS font-size property to make the text display smaller.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top