Q695 Posted October 5, 2012 Share Posted October 5, 2012 <td> <?php mapgen(0, 0); // base image not in div tag ?> <div STYLE="{z-index:1;}"> <img src="images/here.gif" height="20" width="20" style="z-index:1;"> </div> </td> What's wrong that would put 1 image below the other in a table format? Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/ Share on other sites More sharing options...
Mahngiel Posted October 5, 2012 Share Posted October 5, 2012 other than you using tables for layout? Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1382886 Share on other sites More sharing options...
Q695 Posted October 5, 2012 Author Share Posted October 5, 2012 I'm old school, and one image is being placed below the other one, not layered in the <td>. Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383026 Share on other sites More sharing options...
Mahngiel Posted October 5, 2012 Share Posted October 5, 2012 1. Your syntax isn't correct on the div's style 2. There's no reason to use a div, just use two img tags 3. You'll need to disrupt the natural flow of the DOM by using a position attribute 4. The two elements would need to have differing z-indexes Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383068 Share on other sites More sharing options...
Q695 Posted October 5, 2012 Author Share Posted October 5, 2012 Fail <img width="20" height="20" alt="terain" src="images/water.jpg" style="z-index:0;"> <img width="20" height="20" style="z-index:1;" src="images/here.gif"> Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383076 Share on other sites More sharing options...
Mahngiel Posted October 5, 2012 Share Posted October 5, 2012 the failure is only at your end: http://jsfiddle.net/9yKY8/ Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383103 Share on other sites More sharing options...
Q695 Posted October 6, 2012 Author Share Posted October 6, 2012 Almost, both images are the exact same size (25px X 25px), and one image is supposed to have the other in the background. Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383125 Share on other sites More sharing options...
Mahngiel Posted October 6, 2012 Share Posted October 6, 2012 I hope you're not implying for me to update the code. Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383150 Share on other sites More sharing options...
Q695 Posted October 6, 2012 Author Share Posted October 6, 2012 I don't know CS as well as I can throw the book. Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383343 Share on other sites More sharing options...
Mahngiel Posted October 6, 2012 Share Posted October 6, 2012 I don't know CS as well as I can throw the book. Today's as good a time as any to learn! Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383380 Share on other sites More sharing options...
RLAArtistry Posted October 7, 2012 Share Posted October 7, 2012 the failure is only at your end: http://jsfiddle.net/9yKY8/ This works fine. If both images have the same width and height the the top and the left should be "0". { position: absolute; z-index: 2; top: 0; left: 0;} Are you trying to do a CSS rollover image? Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383421 Share on other sites More sharing options...
kjetterman Posted October 9, 2012 Share Posted October 9, 2012 Can you use the z-index attribute with absolute positioning? I thought you could only use z-index with relative positioning. That might be the issue. Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1383981 Share on other sites More sharing options...
Beeeeney Posted October 10, 2012 Share Posted October 10, 2012 Can you use the z-index attribute with absolute positioning? I thought you could only use z-index with relative positioning. That might be the issue. No, you can use it with absolute positioning. Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1384139 Share on other sites More sharing options...
Christian F. Posted October 10, 2012 Share Posted October 10, 2012 You can use z-index without any positioning at all, though it would be a bit pointless. At least in most cases. Quote Link to comment https://forums.phpfreaks.com/topic/269105-overlapping-images/#findComment-1384286 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.