HTML - Table Grid Color
Similar Tutorialsmy site at http://www.freewebs.com/fallingrain11/1.html im trying to get all the tables the same color but i cant get the last bit of it to color for me the line of code that makes that part of the table i think is ... <td align="left" Width="17%" valign="top" tr> i tried setting the color in .td2{} and tried to call it <td class=td2; ... .... .....> pretty much a beginner with html, have a basic site up. i did some stuff with <tr> and <td> and got different columns. thing is i want the columns to have different colors but it is not working. if i add bg=lightblue inside a table (no i dont intend to mix orange and lightblue later on) it all gets lightblue. <html> <body bgcolor="orange"> <table border="0" width="100%" cellpadding="10"> <td width="20%" valign="top"> <p> <b>Index</b> </p> <p> <a href="/signup">Click here to signup</a> </p> <p> <a href="/download">Download the games</a> </p> <p> <a href="/play">Play a game</a> </p> <b>This site is powered by:</b> <p> <a href="http://python.org">python</a> </p> <p> <a href="http://webpy.org">web.py</a> </p> </td> <td width="60%" valign="top"> <b>Welcome</b> </td> <td width="20%" valign="top"> <b>last column</b> </td> </table> </body> </html> How/where can I add a background color to this table? thanks. Code: <TABLE cellSpacing=0 cellPadding=0 width=100% border=0> <TR> <TD><font class=tbody> <form action="/smusermanager/members/default.asp?action=login" method=post name=login language="JAVASCRIPT" onsubmit="return Validate();"><input type=hidden name=todo value="login"><input type=hidden name=url value="/smusermanager/members/default.asp"> <table border=0 cellspacing=0 cellpadding=0 width=95% align=center class=colorformborder><tr class=colorformborder><td><table border=0 cellspacing=0 width=100% cellpadding=0><tr class=colorformborder><td colspan=2><table border=0 cellspacing=1 cellpadding=5 width=100% colspan=2><tr class=colorformheader><td colspan=2><font class=textsize9><font color=white><b>Login Here</b></font></td></tr> <tr class=colorformfields><td align=center colspan=2><font class=textsize9></font></td></tr><tr class=colorformfieldsalt><td align=right width=50% ><font class=textsize9>Email Address</font></td><td><font class=textsize9><input class=fieldbox type=text size=20 maxlength=50 name="members_username"></font></td></tr> <tr class=colorformfields><td align=right width=20% ><font class=textsize9>Password</font></td><td><font class=textsize9><input class=fieldbox type=password size=20 maxlength=50 name="members_password"></font></td></tr><tr class=colorformfields><td colspan=2 align=right><font class=textsize9><input class=fieldbox type=submit value="Login" id=submit2 name=submit2></font></td></tr> </td></tr></table></td></tr></table></td></tr></table></form> <div style="padding-left: 24px;"> <font face="Arial" color="#000000" size="3"><img src="/images/Hphone.gif" style="vertical-align: middle;"> <a href="?action=login"> Home</a><br><br> <IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone1.gif" style="vertical-align: middle;"><a href="?action=register"> Register</a><br><br> <IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone2.gif" style="vertical-align: middle;"><a href="?action=forgotusername"> FAQ</a><br><br> <IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone3.gif" style="vertical-align: middle;"><a href="?action=forgotusername"> Terms Of Use</a><br><br> <IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone4.gif" hspace="4px" style="vertical-align: middle;"> <a href="?action=forgotusername"> Contact Us</a><br><br> <IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone5.gif" style="vertical-align: middle;"><a href="?action=forgotpass"> Forgot Password</a><br><br> <IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone7.gif" style="vertical-align: middle;"><a href="?action=forgotusername"> Forgot Username</a></font></div> </font> </TD> </TR> </TABLE> Is there a simple attribute for tables that tells it to alternate the colors for every second row? For example, if I want to create a table where the first row background color is grey, the second row is white, the third grey, the fourth white, and so on, is there a simple attribute like "altcolor=grey" or something like that (maybe in CSS)? Hi, I need some code that will make cells in a table change colour (yellow) with mouse over. The problem is that i really need to avoid having to put the code in <TD> as there are about 5000 cells in total! and that will add alot of bytes to it. Needs to work in IE7 and firefox mainly. Any help would be great! Thanks Joe I had the following code,how can I make alternate color for each row?Actually I retrieved the data from database and bind to table,so I do not know the total number of row.How to make alternate color?? Code: Private Sub TableDetails(ByVal MydinProdNbr As String, ByVal OldStockCode As String, ByVal SupplierPrdNbr As String, ByVal Description As String, ByVal Packing As String, ByVal ListPrice As String, ByVal Disc1 As String, ByVal Disc2 As String, ByVal Disc3 As String, ByVal TotalOrderQty As String, ByVal DeliveredQty As String, ByVal SelectedQty As String, ByVal FOCQty As String, ByVal DiscountAmt As String, ByVal NetUnitPrice As String, ByVal Amount As String) lbl.Text = lbl.Text & "<tr bgcolor=#99CCFF>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""63pt"">" lbl.Text = lbl.Text & MydinProdNbr lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""60pt"">" lbl.Text = lbl.Text & OldStockCode lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""62pt"">" lbl.Text = lbl.Text & SupplierPrdNbr lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""180pt"">" lbl.Text = lbl.Text & Description lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""56pt"">" lbl.Text = lbl.Text & Packing lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""64pt"">" lbl.Text = lbl.Text & ListPrice lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""49pt"">" lbl.Text = lbl.Text & Disc1 lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""49pt"">" lbl.Text = lbl.Text & Disc2 lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""49pt"">" lbl.Text = lbl.Text & Disc3 lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""49pt"">" lbl.Text = lbl.Text & TotalOrderQty lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""49pt"">" lbl.Text = lbl.Text & FOCQty lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""67pt"">" lbl.Text = lbl.Text & DiscountAmt lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""49pt"">" lbl.Text = lbl.Text & NetUnitPrice lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "<td style=""font-size: 7pt"" width=""60pt"">" lbl.Text = lbl.Text & Amount lbl.Text = lbl.Text & "</td>" lbl.Text = lbl.Text & "</tr>" End Sub My tables background color (done with dreamweaver) isn't showing correctly in Firefox. but is in internet explorer. Code: <td colspan="2" rowspan="4" bgcolor="de8801">TEXT</td> is the code I'm using to define the background color? Can anyone help?! Anders Hi, I need to write text in different colors in the cells of a table... for now i use <FONT> but since it is deprecated how can i do this without FONT? HTML Code: <TABLE> <TR> <TD><FONT COLOR=BLUE>BLUE</FONT></TD> <TD><FONT COLOR=RED>RED</FONT></TD> <TR> <TD><FONT COLOR=BLACK>BLACK</FONT></TD> <TD><FONT COLOR=YELLOW>YELLOW</FONT></TD> </TABLE> I am working on a site that I have designed using a table to lay everything out. Everything works fine when viewing via IE. I tried opening it with Firefox and the backround colors for the different cells did not show up. Can anyone tell me what I should do so that the bgcolor shows up correctly in firefox? temp web-site address: http://worldcargousa.com/estate_lawn part of the html in question: <td width="166" align="center" valign="middle" bgcolor="61592b"><p align="center" class="style9"><span class="style15">715-220-1879 </span></p> <p class="style13">Estate Lawn Services<br> 536 Gentalwood Square<br> Purcellville, VA 20132</p> <p align="left" class="style8"> </p></td> So I decided to see if I could make my site XHTML 1.0 Strict-compliant. Here's the main page on my test server I'd be thrilled with it if I could do 3 things: - Set the background color of the left column to match the color behind the fonts. Is there a CSS class I can create and set the cells to that class? - Remove the border around clickable images. - Get the spacing between the menu options on the left to look the way it does on the other pages in the site. If you click any of the pages on my actual site you can see the look I'm going for. Thanks as always for the help! Joshua Hi, I'm trying to create a gallery of iamges in a strict grig and am having trouble getting the images to align. It will be a gallery of thumbnails which will be links to the main images. Anothet problem i'm having at the moment apart form aligning them is that in Firefox i get a border around the image as it is a link, this doesn't happen in safari. thanks dyfrig Hi all. FYI, I don't know how to do this and not sure if this is the best place to post. I'd like to make a small map that's 1000 x 1000 in boxes. The idea is that the user could, with a mouse, select a block within this map as long as it's within the specified perimeter. How should I even get started? Hi, I want to change the background color of my textbox on focus and change it back to white on onblur event. Issue: When i change the back ground color for text box on focus it properly changes it. But when i leave the focus from textbox border color for text box is impacted and its changed to white. Please help so that border color for textbox is not impacted only background color should change here is the sample code <code> <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <p> <input name="text1" type="text" id="text1" value="textbox 1" onfocus="this.style.background ='#cad5df'" onblur="this.style.background='white'"> </p> <p> <input name="text2" type="text" id="text2" value="textbox 2" onFocus="this.style.background = 'yellow'" onBlur="this.style.background='white'"> </p> </body> </html> </code> ok, this might be very elementary but I can't figure out how to do this basically I built a block of square links that have a javascripted mouseover feature someone on here actually coded it for me (spyboy, thanks) the block of graphics gridded itself nicely, but I need to move the whole thing over to the right a few pixels (because I have major compulsiveness since I'm a designer) heres a screenshot of how it looks now as you maybe notice, the block of graphics are too much to the left, I need to center them. They only really need to move to the right probably 20 or so pixels heres the javascript code Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Untitled Page</title> <script type="text/javascript"> function change(img_name, img_src) { document[img_name].src = img_src; } </script> </head> <body> <a href="http://www.sassnyc.com/contact" onmouseover="change('friends', 'http://andrewsass.squarespace.com/storage/friends_on.png')" onmouseout="change('friends', 'http://andrewsass.squarespace.com/storage/friends_off.png')"> <img src="http://andrewsass.squarespace.com/storage/friends_off.png" border="0" name="friends" /> </a> <a href="http://www.massnerder.blogspot.com" onmouseover="change('danielle', 'http://andrewsass.squarespace.com/storage/danielle_on.png')" onmouseout="change('danielle', 'http://andrewsass.squarespace.com/storage/danielle_off.png')"> <img src="http://andrewsass.squarespace.com/storage/danielle_off.png" border="0" name="danielle" /> </a> <a href="http://www.csaustodesign.com" onmouseover="change('sausto', 'http://andrewsass.squarespace.com/storage/sausto_on.png')" onmouseout="change('sausto', 'http://andrewsass.squarespace.com/storage/sausto_off.png')"> <img src="http://andrewsass.squarespace.com/storage/sausto_off.png" border="0" name="sausto" /> </a> <a href="http://www.alexmoskowitzphotography.blogspot.com" onmouseover="change('alex', 'http://andrewsass.squarespace.com/storage/alex_on.png')" onmouseout="change('alex', 'http://andrewsass.squarespace.com/storage/alex_off.png')"> <img src="http://andrewsass.squarespace.com/storage/alex_off.png" border="0" name="alex" /> </a> <a href="http://www.milkshakenyc.com" onmouseover="change('milkshake', 'http://andrewsass.squarespace.com/storage/milkshake_on.png')" onmouseout="change('milkshake', 'http://andrewsass.squarespace.com/storage/milkshake_off.png')"> <img src="http://andrewsass.squarespace.com/storage/milkshake_off.png" border="0" name="milkshake" /> </a> </a> <a href="http://www.pegasus17.com" onmouseover="change('pegasus', 'http://andrewsass.squarespace.com/storage/pegasus_on.png')" onmouseout="change('pegasus', 'http://andrewsass.squarespace.com/storage/pegasus_off.png')"> <img src="http://andrewsass.squarespace.com/storage/pegasus_off.png" border="0" name="pegasus" /> </a> </a> <a href="http://www.greenbusinesscompetition.com" onmouseover="change('GBC', 'http://andrewsass.squarespace.com/storage/GBC_on.png')" onmouseout="change('GBC', 'http://andrewsass.squarespace.com/storage/GBC_off.png')"> <img src="http://andrewsass.squarespace.com/storage/GBC_off.png" border="0" name="GBC" /> </a> </a> <a href="http://www.kyeonyc.com" onmouseover="change('kyeo', 'http://andrewsass.squarespace.com/storage/kyeo_on.png')" onmouseout="change('kyeo', 'http://andrewsass.squarespace.com/storage/kyeo_off.png')"> <img src="http://andrewsass.squarespace.com/storage/kyeo_off.png" border="0" name="kyeo" /> </a> </html> Any help/advice is appreciated! Thanks Hello all! Does anybody noticed that font colors are treated as background color while printing in IE? I just set a <font color=#f0f0f0>MY TEST</font> or <span style="color: #f0f0f0">MY TEST</span> and, on screen, it's OK. On print preview, it goes black. I can print in grayscale only if I turn "print background images and colors" on. Does anybody has a workaround on it? It will be a watermark, so it should be printed in grayscale. I dont think I'm setting a background color, specially on first example (color of the font). Thanks! I have a social network. I want my users to be able to pic colors for certain things... I'd really like to use the GUI that twitter has for this, but that could be expensive... So how do I do it? And how do i get smilies to input text into a text box like this one... Dynamic pages are going to be hard i think When I view my site at 32 bit color at a res of 1028x1200, I can't see my hr lines. But when I view it at 16 bit I can. Anyone know why? And yes it and my CSS validate. Geoserv. edit: site www.apnaonline.ca hi all how do i change color for this code its for php tags Code: echo 'Not bad, you scored average'; i want it to be red thanks hiii. this may be a silly question, but i still cant figure out how to add the color of the border in the <img src> code. for example... <img src="lalala.jpg" border="2" BORDERCOLOR="??"> or is it not possible? I need help deciding on a color scheme for the Washington Huskies. I don't want it to be to bright but right now it's purple and black so it needs to be a little lighter. Could you also specify what to make the colors like text or background or whatever. Thanks. |