i am trying the image to cover full page.
Vertical scroll : allowed
Horizontal scrolling : disallowed
Image : image must show full page without leaving border and responsive based on device size.
html, body, img {
max-width: 100%;
min-height: 100%;
height: auto;
width: auto;
overflow-x: hidden;
}<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
</head>
<body>
<img src="example.png" />
</body>
</html>The issues is, it leaving a blank space in all 4 side of the screen. How to fix this?
>Solution :
It may Help you :
*{
padding:0px;
margin:0px;
}
img{
width:100%;
object-fit:cover;
max-width: 100%;
}