I'm asking this here because I am really not sure how to do this, and I need more HTML help at this point than graphics.<br />
At the right side column of my page I will have 3 photographs. Since I've measured them, I want to kind of make a photo collage with 2 on the most bottom layer and one running in between these, with edges of about 20 pixels overlapping the other photos. How do I accomplish this in the code?<br />
Thanks!<!--content-->I'm having a hard time visualizing what you want. Maybe you can make a quick sketch, or tape the three pictures together, scan them and attach the picture to your next post so we can see what you mean.<!--content-->okay, keep in mind that I am only using Paint shop pro as Photoshop is acting up... I don't want to do this as an entire graphic collage because I don't want to have that much load time. <br />
Here it is... I want all the pictures to be the same size, as i have in my layout... The picture does not do the effect justice.<br />
<!-- m --><a class="postlink" href="http://foreverfree.com/stargal1998/visual.jpg">http://foreverfree.com/stargal1998/visual.jpg</a><!-- m --><br />
Thanks!<!--content-->Suppose your pics are 120 px tall:<div style="top: 0px; left: 0px"><br />
<img src=http://www.webdeveloper.com/forum/archive/index.php/"the first picture"><br />
</div><br />
<div style="top: 200px; left: 0px"><br />
<img src=http://www.webdeveloper.com/forum/archive/index.php/"the third picture"><br />
</div><br />
<div style="top: 100px; left: 0px"><br />
<img src=http://www.webdeveloper.com/forum/archive/index.php/"the second picture"><br />
</div>This works because of the layer order. The image at 100 is laid on top of the other two images because it is listed last. Or, you can guarantee the stacking order by specifying the z-index in the style.<br />
<br />
(If you don't know ahead of time how big the images are, you'll need some javascript to position the DIVs after the images load)<!--content-->Thanks for the info, Gil. That still didn't do it...They are in a row right now. I'm going to try and resize the layout... But thank you for your help! <br />
See Ya!<!--content-->
At the right side column of my page I will have 3 photographs. Since I've measured them, I want to kind of make a photo collage with 2 on the most bottom layer and one running in between these, with edges of about 20 pixels overlapping the other photos. How do I accomplish this in the code?<br />
Thanks!<!--content-->I'm having a hard time visualizing what you want. Maybe you can make a quick sketch, or tape the three pictures together, scan them and attach the picture to your next post so we can see what you mean.<!--content-->okay, keep in mind that I am only using Paint shop pro as Photoshop is acting up... I don't want to do this as an entire graphic collage because I don't want to have that much load time. <br />
Here it is... I want all the pictures to be the same size, as i have in my layout... The picture does not do the effect justice.<br />
<!-- m --><a class="postlink" href="http://foreverfree.com/stargal1998/visual.jpg">http://foreverfree.com/stargal1998/visual.jpg</a><!-- m --><br />
Thanks!<!--content-->Suppose your pics are 120 px tall:<div style="top: 0px; left: 0px"><br />
<img src=http://www.webdeveloper.com/forum/archive/index.php/"the first picture"><br />
</div><br />
<div style="top: 200px; left: 0px"><br />
<img src=http://www.webdeveloper.com/forum/archive/index.php/"the third picture"><br />
</div><br />
<div style="top: 100px; left: 0px"><br />
<img src=http://www.webdeveloper.com/forum/archive/index.php/"the second picture"><br />
</div>This works because of the layer order. The image at 100 is laid on top of the other two images because it is listed last. Or, you can guarantee the stacking order by specifying the z-index in the style.<br />
<br />
(If you don't know ahead of time how big the images are, you'll need some javascript to position the DIVs after the images load)<!--content-->Thanks for the info, Gil. That still didn't do it...They are in a row right now. I'm going to try and resize the layout... But thank you for your help! <br />
See Ya!<!--content-->