|
HTML - Semi-transparent Tables, Full Opacity Text?
Hello.
I've searched numerous times on Google for answers to this problem I'm having and I'm getting no help. I've posted here before with the same website but I have a different layout (or I'm making one) so I have a different problem. To view the website click here, although I don't have the new layout up on the web yet. I have a picture as the background and I have the semi-transparent tables, but the text is semi-transparent as well and I really don't like that. The code I have for the semi-transparent tables is: Code: table, tr, td {
filter: alpha(opacity=75);filter:progid:DXImageTransform.Microsoft.Alpha(opacity=75); -moz-opacity:0.75;
}
So that's all fine and good, but I can't get the text to show up solid. Is there a way that I can have the semi-transparent tables and full opacity text? I'm extremely bad with CSS, so I don't know much what I'm doing here. Similar Tutorialsi am trying to call a transparent png as an image background for a table and i have the code to get it to work for IE 6 and IE 7 but when i add in a doctype "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">" it doesnt work. Here is a section of my code: <style type="text/css"> .stock { background-image: url("BG.png"); background-repeat: repeat; background-position: top; behavior: url('pngbehavior.htc'); padding: 11px; } </style> and then call the table like this: <table width=800 class=Stock> the pngbehavior.htc is the same transparent png attachment that is floating around the net. What i am trying to know is does anybody have a way of calling it so that it works in IE 5, 6, 7 and firefox with the doctype command? it works fine before i put the doctype command in it but i am using some other code that needs it. Thanks guys I need help/ I applied an opacity on my table background. But the problem is, i have content such as images and text areas in my table which are getting affected by the opacity i placed on my table. I applied a 14% opacity to my table and now its making my images and textbox inside my table invisible. anyway to fix this problem. here is an example of my code HTML <table class="home"> <tr> <th>Welcome</th> </tr> <tr> <td width="100" height="200"> <p><img src="Web Photos/welcomebanner.gif" class="feature" width="1025" height="200" /></p> </tr> CSS table.home td { font-size: small; border: 1px solid FFFFFF; background-color: #FFFFFF; filter: alpha(opacity=14); } Hi, I have a header in blue, and the text is black. I would like the header to be a darker blue, and the text transparent. Could anyone help? Thank you. Nick I have seen this many times but can not figure how to do it. Its the transparent images or text in text boxes, one example of this is http://au.movies.yahoo.com/Coming+Soon/to-cinemas/ At the top right you can see that transparent yahoo image in the text box and when you click it it disappears then comes back? can someone tell me how this works? Thanks Please help, I am uploading my site back to my server after some updates. The main page is blurring all the pages linked via iframe. If you visit the main page all my text is blurry: http://www.sillywabbitproductions.com/ But if you visit the actual pages the text is just fine: http://www.sillywabbitproductions.com/main.html I've already diabled ClearType in case that had anything top do with it. Any idea what's causing this? Thanks in advance. Hi All, Nice site BTW, my problem is i want to add some text with a background colour behind it but i want the background colour to stretch the full width of the page ? Can anybody help me out Thanks I want to make a transparent rectangle with rounded edges to be where I put my text. I already found this: http://www.spacedust.com/scripts/rounded_table/ but I don't know if it'll work. i'm trying to put a transparent png img on a colored background, in IE6 the transparent part of the img appears as a color instead of transparent how can i fix that??? the attached imgs shows how it's appearing in IE6 and FF I've used a code for a layout on my blog at blogger.com, and I've tweaked it to my likeness except for the fact that the photos on my blog all are semi transparent. Does anyone know what I should look for to change so the photos appear as solid? Thanks for any help. If anyone wants to see the code in it's entirety I can post it. http://www.miamiknight.com/table.htm How do I get the text in all 3 columns to align at the top? I had to add breaks or rows in column 3 at the bottom to bring the text higher and then column 2 had the text drop lower. Is there an easy way to always have text align at the tops of each column? Ok, so when I get this answer Im probably gonna feel like a fool, but here it goes... At the bottom of my page, I am placing a paragraph on the left side, and on the right side and I want to place a square box. But I cant figure it out, and quite frankly, it is making me very mad. If someone could please tell me the code or give me help, I would appreciate it. Thanks! I have tables containing text in them but the background does not appear its just a white error background the text appears however. Heres my html i don't know whats wrong. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Pink Pirates</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.style12 {font-family: Tahoma; color: #999999; font-weight: bold; }
.style13 {font-size: 9px; color: #666666; }
.style14 {color: #CCCCCC}
-->
</style>
</head>
<link href="css.css" rel="STYLESHEET" type="text/css">
<body>
<center>
<table width="776" border="0" cellpadding="0" cellspacing="0" background="images/index_28.jpg">
<!--DWLayoutTable-->
<tr>
<td width="59" rowspan="2" valign="top"><img src="images/sides_01.jpg" width="59" height="459"></td>
<td height="363" colspan="2" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutTable-->
<tr>
<td width="660" height="69" valign="top"><img src="images/index_02.jpg" width="230" height="69"><img src="images/index_03.jpg" width="201" height="69"><img src="images/index_04.jpg" width="229" height="69"></td>
</tr>
<tr>
<td height="150" valign="top"><img src="images/index_06.jpg" width="371" height="171"><img src="images/index_07.jpg" width="289" height="171"></td>
</tr>
<tr>
<td height="17" valign="top"><img src="images/index_08.jpg" width="660" height="17"></td>
</tr>
<tr>
<td height="27" valign="top"><a href="index.php"><img src="images/index_09.jpg" alt="Home Page" width="104" height="27" border="0"></a><a href="team.php"><img src="images/index_10.jpg" alt="Our Team" width="101" height="27" border="0"></a><a href="videos.php"><img src="images/index_11.jpg" alt="Demo Videos and Screenshots" width="78" height="27" border="0"></a><a href="/forums/"><img src="images/index_12.jpg" alt="Community Message Boards" width="142" height="27" border="0"></a><a href="about.php"><img src="images/index_13.jpg" alt="About Our Clan" width="100" height="27" border="0"></a><a href="signup.php"><img src="images/index_14.jpg" alt="Join Our Team" width="135" height="27" border="0"></a></td>
</tr>
<tr>
<td height="40" valign="top"><img src="images/index_15.jpg" width="660" height="40"></td>
</tr>
<tr>
<td height="28" valign="top"><img src="images/index_16.jpg" width="660" height="28"></td>
</tr>
<tr>
<td height="11" valign="top"><img src="images/index_17.jpg" width="660" height="11"></td>
</tr>
</table></td>
<td width="57" rowspan="2" valign="top"><img src="images/sides_05.jpg" width="57" height="459"></td>
</tr>
<tr>
<td width="231" height="163" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutTable-->
<tr>
<td width="231" height="122" valign="top"><img src="images/index_18.jpg" width="231" height="28"><img src="images/tdw_22.jpg" width="231" height="60" border="0"></a><img src="images/cathead_25.jpg" width="231" height="34"></td>
</tr>
<table>
<tr>
<td height="193" valign="top">text goes here blah</ </div></td>
</tr>
</table>
</td>
<td width="429" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="429" height="28" valign="top"><img src="images/index_19.jpg" width="429" height="28"></td>
</tr>
<tr>
</tr>
<tr>
<td height="34" valign="top"><img src="images/catheadnews_26.jpg" width="429" height="34">dfdfdfdfdfdfd</td>
</tr>
<tr>
<td height="193" valign="top"><div style="margin-left:10px; margin-right:10px"><span class="style12"></span><br>
<span class="style13"></span><br>
<span class="style14">
</tr>
</table></td>
</tr>
</table>
<table width="776" border="0" cellpadding="0" cellspacing="0" background="images/index_30.jpg">
<tr>
<td width="136" height="32"></td>
<td width="509"> </td>
<td width="131"></td>
</tr>
<tr>
<td height="12"></td>
<td valign="top"><div align="center">Copyright PinkPirates.tk. All rights reserved. </div></td>
<td></td>
</tr>
</table>
</center>
</body>
</html>
Hey there, I have some text in a table that i want to vertically align center, however nothing i try with html or css seems to work. This is my current code atm; Code: <table cellpadding="0">
<tr>
<td width="150" height="100" style="vertical-align:middle">
<img src='portals/default.jpg' > </td><td style="vertical-align:middle">
<h3><b><a href="/games/node/2">Welcome to the Halo Portal</a></b></h3><i><div style='font-size:0.9em; line-height: 0.3em;'>Posted by NightFox, on 15/03/09</div></i><br /><div style='line-height: 0.2em'><p>Welcome to the Halo Portal</p>
</div>Halo <td></tr>
</table>
I want it all to vertically aligned centrally so that the text will line up with the center of the thumbnail - attached is wat it looks like atm. If anyone has any ideas please let me know (html, css, or php i don't mind) Regards NightFox I need help. I have a page but its centered. I still have white non used space on both sides that i would like to use to post links and what not but im not too great with tables. My test website is down below. Id like to keep the same dimensions of the page where it is now, but need to be able to use the blank white space on the sides to post links and extra text and what not. Can anyone help? www.militarycheapskate.com I'm about to go crazy. I'm working on a website, in tables (yes I know, CSS...not there yet) It's for a friend and I'm doing this on the side. and I've been humming right along building this thing. I havn't done anything in about a week. I go into dreamweaver, open a sample page I created, and cut and pasted text from a word doc into the table inside the html document. When I do this, the table accommodate the text and stretches out messing up the whole layout. WTF!? It hasn't done this before with the other 20 pages. I saved the word doc, as a web page, as plain text, I imported the text into a google doc, I pasted it inside of a preset table width. NOTHING WORKS! I tried to open up the html code and adjust the width of the tables inside the code, The thing is, is that I'm using a template, so when the template itself stretches itself, I cannot adjust it, because its the template. I get the little circle with a line across it. here is the link: http://www.altmedschools.com/acapunc...tate_laws.html I appreciate any help, I really just want to get this site finished! Hi... I have two (hopefully simple) questions: First, is there any way to make a table resize automatically to fit a browser window regardless of the size of the window when the table contains images? I know how to make the table fit the window using <width="85%">, but that only works to a certain point. What I would like to have the image resize itself as the table shrinks. Is this possible? Also, How do I get text to wrap around an image. Like have the image in the upper left corner. Then the text would start at the top of the image directly to it's right and continue on to the bottom of the image. Then it would drop down below the image all the way to the images left edge. I hope I am asking this correctly. Thanks in advance! Hi, I can make basic websites but I am not very skilled in web design. I am in need of help. Since I made the website inside Photoshop using slices, I need to create a table at the center of the website. Since the center of the website is made of slices of jpeg images, I cannot create a table nor add any text here without disturbing the images. I can get around this by making the pictures part of the cell background, but when I try and remove the images in the center after, the cell background images repeat over and over, and the whole website is unaligned and a big mess! Below is a picture of what I mean... I have included a zip file containing my html pages and image folder. Please download it he http://homepage.ntlworld.com/stephan.../Portfolio.zip The file I need help with is work.html. I can ensure you it's virus free. I want to show my photoshop work off on a website, this is the reason why I am making this website. I am having a problem with a web page that when I use the echo statement and try to output data to the web page in a table the data in the table pushes the data from another row down the page. What should I do to stop this from happening. I am using adobe dreamweaver. Thanks a lot!! You know this code in html: <img src="klematis.jpg" width="150" height="113" alt="klematis" style="opacity:0.4;filter:alpha(opacity=40)" /> It's used to do the opacity of an image my question is how can I do this with css jus so I donot have to put it for every image. |
|||||||