Can anyone help figure out why I am having troubles placing text over an image using CSS. Is it because its in a table? or should that not matter?
HTML CODE:
<table width="776px">
<tr>
<td width="19" height="43" align="left" valign="top"><img src=http://www.webdeveloper.com/forum/archive/index.php/"images/body1.gif"></td>
<td width="276" height="43">
<div id="bged">
<div id="textbody">TEXT TO GO OVER IMAGE</div>
</div>
</td>
<td><img src=http://www.webdeveloper.com/forum/archive/index.php/"images/body3.gif"></td>
</tr>
</table>
CSS CODE:
#bged {
background-image: ('images/body2.gif');
background-repeat: no-repeat;
height: 43px;
width: 276px;
}
#textbody {
position: relative;
height: auto;
width: auto;
left: 100px;
top: 10px;
}
I would appreciate the help...it's driving me nutzos.
Cheers,
Nemo43Try using absolute positioning instead of relative positioning.
HTML CODE:
<table width="776px">
<tr>
<td width="19" height="43" align="left" valign="top"><img src=http://www.webdeveloper.com/forum/archive/index.php/"images/body1.gif"></td>
<td width="276" height="43">
<div id="bged">
<div id="textbody">TEXT TO GO OVER IMAGE</div>
</div>
</td>
<td><img src=http://www.webdeveloper.com/forum/archive/index.php/"images/body3.gif"></td>
</tr>
</table>
CSS CODE:
#bged {
background-image: ('images/body2.gif');
background-repeat: no-repeat;
height: 43px;
width: 276px;
}
#textbody {
position: relative;
height: auto;
width: auto;
left: 100px;
top: 10px;
}
I would appreciate the help...it's driving me nutzos.
Cheers,
Nemo43Try using absolute positioning instead of relative positioning.