Solved

Font size in browser smaller than normal

Posted on 2014-09-07
2
315 Views
Last Modified: 2014-09-07
Here is a minimal HTML page:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta content="en-us" http-equiv="Content-Language">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<style type="text/css">
p { font-family: Courier New;	 font-size: 14px; font-weight: bold; }
</style>
</head>
<body>
<p>Site Under Construction</p>
</body>
</html>

Open in new window


When I open this page in any browser, the font looks smaller than normal 14px.
In browsers, zoom level is 100% and font size is medium.

I compare font size with what Notepad would render at 14px, same font, bold. Same in Word.
However, if I increase browser zoom level at 125%, font suddenly looks normal.

This happens in all browsers. What am I missing?
0
Comment
Question by:campinam
2 Comments
 
LVL 58

Assisted Solution

by:Gary
Gary earned 250 total points
ID: 40309157
Your confusing points and pixels.
Notepad uses pt and your webpage is using px
0
 
LVL 83

Accepted Solution

by:
Dave Baldwin earned 250 total points
ID: 40309158
Notepad only has point sizes available, not pixel sizes.  A font at 16 pixels is the same as 12 points.  This page http://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/ seems to have a good description of the different methods for fonts sizes.
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Find out what you should include to make the best professional email signature for your organization.
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
Google currently has a new report that is in beta and coming soon to Webmaster Tool accounts. This Micro Tutorial will highlight new features for Google Webmaster Tools.

929 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now