Roy766 Posted January 16, 2009 Share Posted January 16, 2009 Hi all! Sorry if this is in the wrong section, but I'm not really sure if this would relate to PHP, CSS, JS, or just basic HTML. Just one basic question: I want to have a sort of background image, and then put smaller images on top of it. Think of it sort of like a game: where I have a map and some sprites on top of them. Sorry for the really stupid question, but I really have no idea how to do this :-\ Quote Link to comment https://forums.phpfreaks.com/topic/141014-overlapping-images/ Share on other sites More sharing options...
CyberShot Posted January 16, 2009 Share Posted January 16, 2009 this could be done with css and html. Here is how <div id="backgroundImage"> <div id="smallImage"> <img src="Path to your image" width="size here" height="size here" /> </div><!--end smallImage div--> </div<!--end backgroundImage div --> so you would need to make an html file and the css file linked like this <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <link href="stylesheet.css" rel="stylesheet" type="text/css" /> <title></title> </head> <body> <div id="backgroundImage"> <div id="smallImage"> <img src="servlet.jpeg" width="100" height="158" /> </div><!--end smallImage div--> </div<!--end backgroundImage div --> </body> </html> then make a file named stylesheet.css and drop the css code into that file and put it in the same location as the html file #backgroundImage { position: relative; width: 400px; height: 400px; background:url(YOUR IMAGE HERE.jpg) repeat; } #smallImage { position: absolute; top: 30px; left: 60px;} /* CHANGE TOP AND LEFT TO WHAT YOU NEED */ Quote Link to comment https://forums.phpfreaks.com/topic/141014-overlapping-images/#findComment-738150 Share on other sites More sharing options...
noober Posted January 23, 2009 Share Posted January 23, 2009 In XHTML you could place your images in divs then set their positioning and z-index to make them overlap. Quote Link to comment https://forums.phpfreaks.com/topic/141014-overlapping-images/#findComment-744173 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.