Compare height setting in inch and pixel in HTML and CSS

Description

The following code shows how to compare height setting in inch and pixel.

Example


<!--   w  w  w  .j av a2  s  .  com-->
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=UTF-8' />
<title>Pixels to Inches</title>
<style type='text/css'>
div {
background: #000;
border: 1px solid rgb(128, 128, 128);
color: white;
font: 9px monospace;
margin: 15px;
text-align: center;
}
div#inches {
width: 1in;
height: 1in;
}
div#pixels {
width: 96px;
height: 96px;
}
</style>
</head>
<body>
<div id='inches'>&lt;-- 1 Inch --&gt;</div>
<div id='pixels'>&lt;-- 96 Pixels --&gt;</div>
</body>
</html>

Click to view the demo

The code above generates the following result.

Compare height setting in inch and pixel in HTML and CSS

Home »
  HTML CSS Tutorial »
    Layout »
      Size

HTML CSS Tutorial Size

Compare height setting in inch and pixel in...