CSS-OVERFLOW Hidden not Working for Absolutely Positioned Elements
Adding the parent element with position: relative; solves the problem.
<html>
<head>
<title>project</title>
</head>
<body>
div id="wrapper">
div id="content">
img src="image.jpg" width="1400" height="1200" />
/div>
/div>
</body>
</html>
In order to have absolute positioned “wrapper img” work with the property of overflow: hidden, position the parent element “wrapper” to relative.
#wrapper {
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
}
#content {
width: 100%;
height: 100%;
}
#wrapper img {
position: absolute;
top: 0;
left: 0;
width: 100%;
}
Post a Comment