Log in

View Full Version : Need help to create a transparent table.


behappytogether
05-12-2006, 04:42 PM
Hi all, i wonder if there is a way to create a transparent (or semi transparent) table? I am trying to place a table on a graphic files, but the table will eventually block the image. How can i create a see through table? Thank you!
Regards, Brian :)

If you do not understand the question, please view my site at the following url:

http://www.behappytogether.com/7.Guestbook/Guestbookform.php

or the main page at:

http://www.behappytogether.com

then goto the guestbook to look at the table. Thank you.
JRS
05-19-2006, 10:21 AM
You can either use an image as the background for the entire web page
<BODY BACKGROUND="image.jpg"> and/or use an image as the background of a cell
<td background="image.jpg" colspan=4 height=60 align=center><font size=+4 face="MS Comic Sans">this text will display on top of the cell background</font></td>
Twey
05-19-2006, 10:58 AM
Or, you could not use all that deprecated markup to apply an ugly hack, and instead use background-color: transparent.
<style type="text/css">
.transparentTable {
background-color: transparent;
}
</style>

<!-- ... -->

<table class="transparentTable">
<!-- ... -->
behappytogether
05-19-2006, 03:58 PM
I am thinking to use the following method, something like nested table:

<table width="600" height="185" border="1" align="center">
<tr>
<td background="your picture here"><table width="477" height="141" border="1" align="center">
<tr>
<td height="137"><p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
</tr>
</table>

What do you think?
Twey
05-19-2006, 04:16 PM
Nested tables are a bad idea, generally speaking. They slow down page rendering time quite considerably.
coutancineau
05-20-2006, 11:43 PM
Hi Briand,

did you try using your image as a background as this:
=========
<td><form method="post" action="http://www.behappytogether.com/7.Guestbook/Guestbooksend.php">
<table background="http://www.behappytogether.com/7.Guestbook/images/Guestbook_IR_01.gif" width="575" height="154" border="0" id="Brian and Eve Wedding Website">
<tr>
============

I did try and I could see the image under your form.
behappytogether
06-04-2006, 02:16 PM
Thank you! I will give it a try this coming weekend when i backed home. It is great to have your all kind reply here! :p
monomalvado
06-04-2006, 06:54 PM
Or... in the <TABLE> tag add these two things.
Border="0" BGCOLOR="transparent"
And that will make it like the table isn't even there... Not sure about the tricky imagery...
Twey
06-04-2006, 07:41 PM
... which is deprecated markup for style="background-color:transparent;border:0 none;" which is more or less what I suggested in the first place, except for the removal of the border which was never asked for.