I currently have two images stacked on top of each other within a div element as shown below:
<div class="container">
<img src="somepic.jpg" class="layer" />
<img src="otherpic.jpg" class="layer" />
</div>
Styling is set up with the following code:
DIV.container {
width: 400px;
height: 400px;
overflow: hidden;
z-index: 999;
display: block;
}
IMG.layer {
position: absolute;
}
Later on, I apply some Dojo effects to fade and scale the images, making them larger than the container div. However, even with overflow set to hidden, the entire images still overlap.
My question is, how can I ensure that the image overflow is properly hidden?