How to not display an image if outside of div?

Question

I have multiple images within a div, I change thier positions using JQuery

$("#"+carElem).css({"left": pos.left+50 +"px"});

Im using absolute positioning (relative positioning gives the same result), is it possible to cut off anything that is displayed outside of the parent div .i.e make sure its not shown?

Answer 1

Give the parent div the style overflow: hidden and go back to relative positioning (it won't work with absolute positioning).

There's probably a better way to solve the actual underlying issue, though, if we had a bit more context. But overflow: hidden will probably be part of it regardless.

Answer 2

best way to do that

<div style="overflow:hidden">
    // place images here...
</div>

Answer 3

Add overflow:hidden to the parent div.