how to disable zoom in html page on different screen resolutions
<!DOCTYPE html>
<html>
<head>
<title>Disable the Zoom</title>
<meta name="viewport" content="width=device-width, user-scalable=no" />
<style>
body {
width: 500px;
border: 3px solid #4a91d8;
}
h1 {
color: #4a91d8;
text-align: center;
text-shadow: 1px 3px 2px #000;
}
p {
font-size: 18px;
padding: 5px 0;
margin: 10px;
width: 220px;
height: 320px;
border: 2px solid #4a91d8;
}
div::after {
content: "";
clear: both;
display: table;
}
p:first-child {
float: left;
}
p:last-child {
float: right;
}
</style>
</head>
<body>
<h1>
Lorem Ipsum
</h1>
<div class="clearfix">
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
</p>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
</p>
</div>
</body>
</html>