Text over floated images
- by Barbara
I need to put some text over a series of images in a gallery. I found many tutorials about the text part however the images need to be floated.
Whenever I add float:left though the trick no longer works. My code (css inline for sack of brevity):
<a href="/photos/photo1.php" title="photo1">
<span style="position: relative; width: 100%;">
<img src="/photos/photo1.jpg" alt="" />
<span style="position: absolute; top: 10px; left: 0; width: 100%;">Text over image</span>
</span>
</a>
<a href="/photos/photo2.php" title="photo2">
<span style="position: relative; width: 100%;">
<img src="/photos/photo2.jpg" alt="" />
<span style="position: absolute; top: 10px; left: 0; width: 100%;">Text over image</span>
</span>
</a>
This way the images are one under another but like I said I need to float them without breaking everything else.
