Jump to content
alphaboss

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

Recommended Posts

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.

table.PNG

table for webpage.PNG

Share this post


Link to post
Share on other sites

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 by dsonesuk

Share this post


Link to post
Share on other sites

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.

Share this post


Link to post
Share on other sites

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.

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...