On my website, I have implemented a parallax effect that is functioning properly. However, the issue arises when there is an excessive amount of content on the row, causing it to overflow onto the next row. You can view a screenshot and the link to this page below:
http://skyechopencil.com/retreat-newest/
Upon reviewing image 1 - 7, you'll notice that the content spills over to the next line, creating an unappealing look. My goal is to keep the content within its designated row until it is scrolled through.
In an attempt to address this issue, I experimented with a class in which I tried adjusting the z-index and position attributes. Despite these efforts, the content still seems to get stuck or misplaced.
.imr{
z-index : 1;
position : absolute;
}