Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Markup (HTML, XHTML, XML) _ Text over an Image Table

Posted by: Nebu John Aug 11 2012, 12:43 AM

I have created a table of images in HTML. Now i need to add some text over that image. What shall i do nw?

The image table is Given below..

<table id="Table_01" width="960" height="603" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td colspan="6">
<img src="images/about_01.jpg" width="960" height="32" alt="" position="relative"></td>
</tr>
<tr>
<td rowspan="2">
<img src="images/about_02.jpg" width="69" height="503" alt="" position="relative"></td>
<td colspan="3">
<a href="index.html">
<img src="images/a_return.jpg" width="474" height="70" alt="" position="relative"></td>
<td colspan="2" rowspan="2">
<img src="images/about_04.jpg" width="417" height="503" alt="" position="relative"></td>
</tr>

<tr>
<td colspan="3">

<img src="images/about_05.jpg" width="474" height="433" alt="" position="relative"></td>
</tr>

<tr>
<td colspan="2">
<a href="index.html">
<img src="images/a_home.jpg" width="246" height="67" alt="" position="relative"></td>
<td><a href="gallery.php"><img src="images/a_gallery.jpg" width="213" height="67" alt="" position="relative"></a></td>
<td colspan="2">
<a href="about.html">
<img src="images/a_about.jpg" width="192" height="67" alt="" position="relative"></td>
<td>
<a href="contact.html">
<img src="images/a_contact.jpg" width="309" height="67" alt="" position="relative"></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="69" height="1" alt="" position="relative"></td>
<td>
<img src="images/spacer.gif" width="177" height="1" alt="" position="relative"></td>
<td>
<img src="images/spacer.gif" width="213" height="1" alt="" position="relative"></td>
<td>
<img src="images/spacer.gif" width="84" height="1" alt="" position="relative"></td>
<td>
<img src="images/spacer.gif" width="108" height="1" alt="" position="relative"></td>
<td>
<img src="images/spacer.gif" width="309" height="1" alt="" position="relative"></td>
</tr>
</table>

Posted by: Frederiek Aug 11 2012, 05:02 AM

You can't if you use inline img tags, like you did. Or you'd have to position things on top, making it even more complicated.

If you use CSS background-images, then you will have no problem to add text on top of them.

Posted by: pandy Aug 11 2012, 06:28 AM

Why are all the images positioned relative, even the spacers? Is there a reason?

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)