The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Design How do I place an image on top of another image? Reply To: How do I place an image on top of another image?


Sorry – we can’t diagnose a vague description. We’d need to see your code in a CodePen demo to offer any specific help. Until then, here are some CSS positioning property for you to research;

  • position
  • top / left / bottom / right
  • z-index

If you haven’t done already, you might also want to look into responsive image techniques (e.g. max-width:100%; height:auto;) and use fluid measures (e.g. % not px) to place your map pins.

I’m not sure what part CSS Grid plays in you map/image dilemma (my guess is that it’s got more to do with the overall page layout than the actual map/image) but hopefully that will become clearer when you provide your reduced CodePen demo. If it doesn’t have anything to do with the immediate map pin placement issue, please leave it out of the demo – we only need just enought CSS and HTML to illustrate the placement problem (i.e. not your whole codebase).

In the meantime, if you need any further help with positioning and layout basics, try this website