-
Overlaying/Layering help
I would love to know how I can make the word "Sampletext" held in the div tag below, appear over the top of the image in the same table column, rather than below it, can anyone help me here please?
Code:
<html>
<head>
<title> </title>
</head>
<body>
<!-- HEADING TABLE-->
<TABLE Id="tblHeading" border="0" cellpadding="0" cellspacing="0" width="800">
<TR>
<TD VAlign="Bottom" Style="Width:300px"><IMG SRC="images/samplepic.jpg"></TD>
<TD Align="Right" VAlign="Bottom">
<IMG SRC="images/samplepic2.jpg">
<DIV>
SampleText
</DIV>
</TD>
</TR>
</TABLE>
</body>
</html>
-
You could just use a layer :)
Code:
<html>
<head>
<title> </title>
</head>
<body>
<div id="Layer1" style="position:absolute; width:74px; height:20px; z-index:1; left: 658px; top: 218px">SampleTex</div>
<!-- HEADING TABLE-->
<TABLE Id="tblHeading" border="0" cellpadding="0" cellspacing="0" width="800">
<TR>
<TD VAlign="Bottom" Style="Width:300px"><IMG SRC="images/samplepic.jpg" width="203" height="325"></TD>
<TD Align="Right" VAlign="Bottom">
<div> </div>
<IMG SRC="images/samplepic2.jpg" width="203" height="325">
</TD>
</TR>
</TABLE>
</body>
</html>
-
The important part is not the magic word "layer", but the z-index property. You should just be able to add it to what you already have.