user1438038
user1438038

Reputation: 6059

How to reduce the overall font-size of a web site?

Is there a way to reduce the overall font-size of a web site? Suppose we have a WordPress theme (e.g. Highwind), how can the font-size of all page elements be reduced without affecting any other attributes?

I tried setting body { font-size: 1.0em; }, but that will shrink the header's width as well. If I scale the web site to 90 % with Opera's zoom option, the page looks perfect and just the way I want it to look.

So I wonder, what is the easiest way to reduce the size of all fonts on a web site without having to adjust each CSS class individually. The theme uses em for font sizes, so I suppose there must be an acurate solution. I don't understand why the header shrinks as well, though.

Upvotes: 4

Views: 8769

Answers (2)

johntrandall
johntrandall

Reputation: 204

Try playing the the font size on the html element. That will also effect any element with sizing specified in rem (root ems).

Alternately, changing the font size on the body but not html element will effect the size of element specified in ems, but not rems.

See

Upvotes: 3

ralph.m
ralph.m

Reputation: 14345

Try playing with % on the body font size: E.g.

body {font-size: 85%;}

Upvotes: 7

Related Questions