Placing an image on top of a background image within a table.

[alphaboss]

Hello everyone I am trying to place an image within the right hand table but the background image is still shown when I place the image in the right hand table of my website that I am working on I would like that part of the background image covered I have attached screenshots of the HTML code and the webpage that I am working on any help and solutions would be greatly appreciated thanks so very much in advance.

[dsonesuk]

That would only possibly happen when you use position: absolute; in that case, you would have to apply a position: property to both (background AND table elements) and change z-index: layer level so one is a higher than the other.

Edited February 2, 2018 by dsonesuk

[alphaboss]

I did change both position properties for background and table elements to absolute and set the z-index to number 2 for my table elements I have 2 table headers I want the image to go to the right side table header when I saved the file and refreshed my browser the image was on top of the text instead on the left side of my table here is the code I have for the table elements for CSS and HTML:

th {
    position: absolute;
    z-index: 2;
}

<table style="width:100%">
<tr>
<th><font size="4" color="navy">Have you just purchased a computer, printer, or WIFI router either individually or in combination of 2 or more items and don't know how or have no time to set it up? Let Alpha Boss do the setup for you in the comfort of your own home or small business, by clicking Contact at the bottom of this page. Providing fast reliable setup (45 minutes or less)of your purchased computer, printer, or WIFI router. Pricing is $50.00 for either individual or combination setup of 2 or more items.</font></th>
<th><img src="desktop.jpg" width="650" height="550"></th>
</tr>
</table>

Any solution to this problem would be greatly appreciated, thanks.

[dsonesuk]

It does not work like that. You set the z-index: level on the table NOT th, that should bring text AND desktop image to overlap background, IF the background element is how i imagine it to be, i.e a sibling element to the table. Else you need to show both background and table html and how they interact with each other.

 

[alphaboss]

Ok I got it fixed now i changed th to table in my CSS elements code and it works thanks very much.