I know there are a few questions about similar topics but they mostly amount to floating the div/image. I need to have the image (and div) positioned absolutely (off to the
Here's a trick that might work for some:
if you have a container packed with a lot of objects, and you want that positioned object to appear up high in certain cases, and down lower in other cases (various screen sizes for example), then just intersperse copies of the object multiple times in your html, either inline(-block), or with float, and then display:none the items you dont want to see according to the conditions you need.
Here is a JSFiddle to show exactly what I mean: JSFiddle of right positioning high and low
Note: I added color only for effect. Except for the class names, the subject-1 and subject-2 divs are otherwise exact copies of each other.