Solved

Font size in browser smaller than normal

Posted on 2014-09-07
2
322 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

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
I am having a  Git   issue 6 42
How to get bootstrap element to collapse at wider screen width 3 41
Search Item in Table 2 22
HTML <font style="color:red"> 9 32
There’s a good reason for why it’s called a homepage – it closely resembles that of a physical house and the only real difference is that it’s online. Your website’s homepage is where people come to visit you. It’s the family room of your website wh…
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
How to create a custom search shortcut to site-search Experts Exchange using Google in the Firefox browser. This eliminates the need to type out site:experts-exchange.com whenever you want to search the site. Launch your Bookmark Menu: Press 'Ctrl +…

829 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