HTML - How To Change Text Color In Table Cells?
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> Similar TutorialsHello, I'm trying to change the text color within a <li> tag in order to display a red "*Updated*" text since we have updated step 3 and want the user to notice it. I've tried using div but it ends up putting the text after "Updated" on a new line instead of on the same line like I want it. Thank you for any help! Code: div.u1{ font-size:12px; color:red; } Code: <ol> <li>Enter your address in the box below</li> <li>Please check location</li> <li> <div class ="u1">*Updated*</div>For more info...</li> </ol> at the moment the text is white and the background of the data area in the form is white too meaning people can't see what they type in. can someone please help so that they can see what they are typing in? here's the webpage; http://www.myspace.com/blissneso and here's the code; <BR><BR><form method="post" action="http://www.ymlp.com/subscribe.php?blissneso"> <table border="0"> <tr> <td colspan="2"><img src="http://img404.imageshack.us/img404/9911/tile18gk.jpg" alt="title" /></td> </tr> <tr> <td>Name:</td> <td><input type="text" name="YMLP0" size="20"></td> </tr> <tr> <td>Email:</td> <td><input type="text" name="YMLP1" size="20"></td> </tr> <tr> <td colspan="2">Select your location:</td> </tr> <tr> <td>NSW:</td> <td><input type="checkbox" name="CAT2"></td> </tr> <tr> <td>VIC:</td> <td><input type="checkbox" name="CAT3"></td> </tr> <tr> <td>QLD:</td> <td><input type="checkbox" name="CAT4"></td> </tr> <tr> <td>WA:</td> <td><input type="checkbox" name="CAT5"></td> </tr> <tr> <td>SA:</td> <td><input type="checkbox" name="CAT6"></td> </tr> <tr> <td>TAS:</td> <td><input type="checkbox" name="CAT7"></td> </tr> <tr> <td>ACT:</td> <td><input type="checkbox" name="CAT8"></td> </tr> <tr> <td>NT:</td> <td><input type="checkbox" name="CAT9"></td> </tr> <tr> <td>NEW ZEALAND:</td> <td><input type="checkbox" name="CAT10"></td> </tr> <tr> <td>OTHER COUNTRY:</td> <td><input type="checkbox" name="CAT11"></td> </tr> <tr> <td colspan="2"><input type="submit" value="Submit"></td> </tr> </table> </form> thanks for any help in advance!!! I was wondering how one would change the colors of text in a google advertisement.. I'm lost as to how it would be done.. I was wondering if someone could give me the javascript to make text change color or size or make bold when mouse moves over. Thanks for the help! I recently put a comment box on my site and it works well,except when the users start typing, it's black text on a black background. How can I make it white text when they type the comment AND where you input your name? Obviously, if I want white text where you input your name, I'd like to know how to make that text box black as well? http://celticsinsider.webs.com/20March2010.html Just type something in the comment text area and you'll know what I mean Heres the html code: HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <LINK REL="SHORTCUT ICON" HREF="http://celticsinsider.webs.com/images/celticslogo3.gif"> <link rel="alternate" type="application/rss+xml" title="RSS Feeds From CI" href="http://celticsinsider.webs.com/rssfeed2.xml" /> <title>Celtics Insider - News</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link type="text/css" rel="stylesheet" href="style1.css" /> <noscript></noscript><!-- --><script type="text/javascript" src="http://www.freewebs.com/p.js"></script><script language="JavaScript" type="text/JavaScript"> <!-- function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } //--> </script> <style> #HCB_comment_box textarea { background-color:#080708; border:1px solid black; } </style> <style> #HCB_comment_box .submit { background-color:080808; border:1px solid black; } </style> </head> <body onLoad="MM_preloadImages('images/pic2r.jpg')"> <div id="top"> <div id="menu"> <ul> <li><a href="index.html" class="but1"><img src="images/spacer.gif" alt="" width="56" height="13" /></a></li> <li><a href="index2.html" class="but2"><img src="images/spacer.gif" alt="" width="100" height="13" /></a></li> <li><a href="players.html" class="but3"><img src="images/spacer.gif" alt="" width="74" height="13" /></a></li> <li><a href="news.html" class="but4" id="active"><img src="images/spacer.gif" alt="" width="123" height="13" /></a></li> <li><a href="stats.html" class="but5"><img src="images/spacer.gif" alt="" width="88" height="13" /></a></li> <li><a href="http://celticsinsider.forum-motion.com/index.htm" class="but6"><img src="images/spacer.gif" alt="" width="72" height="13" /></a></li> <li><a href="contacts.html" class="but7"><img src="images/spacer.gif" alt="" width="84" height="13" /></a></li> </ul> <div style="position:absolute;top:1px;left:1px;height:0px;width:0px;overflow:hidden"><h1><a href="http://www.greatdirectories.org">best web directories</a></h1><h1><a href="http://www.bestfreetemplates.org">best free templates</a></h1></div> </div> </div> <div id="header" class="home"> <img src="images/spacer.gif" alt="" width="98" height="17" /><br /> </div> <div id="wrapper"> <div id="content"> <p class="title"><img src="images/title62.gif" alt="" width="118" height="13" /></p> <div id="about"> <img src="images/title72.gif" alt="" width="412" height="0" /><br /> <p><strong><b><h1>Pierce's Back-To-Back Threes Seal Deal For C's</h1></b></strong></p> <p><strong><b><h5>By <a href="mailto:FHHS63@gmail.com">Chris Frigo</a></h5></b></strong></p> <a href="http://celticsinsider.webs.com/rssfeed2.xml"> <img border="0" src="images/rss.gif" alt="rss feed for this article" width="36" height="14"></a> <!-- AddThis Button BEGIN --> <a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&username=xa-4ba4d82e1862ffdd"><img src="http://s7.addthis.com/static/btn/v2/lg-share-en.gif" width="125" height="16" alt="Bookmark and Share" style="border:0"/></a><script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4ba4d82e1862ffdd"></script> <!-- AddThis Button END --> <br> <br> <div id="floater"><img src="images/03202010.jpg" align="left"> <p>No matter what rookie sensation Aaron Brooks did Friday night, it seemed Rajon Rondo was there to mirror him.</p> <p>"I just wanted to make him take contested shots," Rondo said. "I didn't want to leave him open tonight. I just tried to send him in with the big guys. Not just me, but they did a great job as well."</p> <p>Rondo scored just two points on 1-5 shooting, however, he had some veteran support from his teammates that helped the Celtics earn a 94-87 victory over the Rockets.</p> <p>Paul Pierce continued his scoring run since coming back from injury, contributing 26 points, while helping the Celtics win three straight games.</p> <p>The coveted match-up between Rondo and Brooks was the biggest headline coming into this game, but it was the Celtics' return to defensive prowess that marks the headlines early this morning. The Celtics held Houston to just 39% shooting from the field, due partly to the efforts of defensive-minded player Kevin Garnett.</p> <p>"We kept everybody intact for the most part," Garnett, who scored 15 points in the victory, said of Boston's defense. "It was just a collective effort. We needed that with a team like this."</p> <p>Ray Allen continued his post-All-Star break dominance as well, scoring 3 three-pointers in just 4 minutes after Houston tied it at 52. Houston would then miss 5 straight shots, helping the Celtics strengthen their lead to 72-62 to start the fourth quarter.</p> <p>"Executing offensively, that's been our Achilles' heel, when we've been bad," Allen said. "With bad offense, you put teams in transition, and we don't give our defense a chance."</p> <p>Luis Scola and the newly-acquired Kevin Martin scored 17 apiece for the Rockets, but Pierce's back-to-back three-pointers with 5 minutes left in the game stretched the Celtics' lead to 88-77, queuing the fans to start exiting the arena.</p> <p>The Celtics will hope to continue their run and win their fourth straight game as they will visit the American Airlines Center to take on Dirk Nowitzki and the Dallas Mavericks starting at 9 P.M. on Saturday.</p> <a href="news.html">previous page</a> <br> <br> <br> <br> <!-- customize labels of htmlcommentbox.com --> <script> // This code goes ABOVE the main HTML Comment Box code! // replace the text in the single quotes below to customize labels. hcb_user = { comments_header : 'Comments', name_label : 'name', submit : 'submit', logout_link : '[log out]', admin_link : '[admin]', no_comments_msg: '', add: '(+) Add your comment', rss: 'comment feed', said: 'said:', prev_page:'<prev', next_page:'next>', website_label:'website (optional)', email_label:'email (optional)', anonymous:'Anonymous', msg_thankyou:'Thank you for commenting!', msg_approval:'(this comment is not published until you approve it)', msg_approval_required:'(Your comment will not be visible until approved by the moderator)', err_bad_html:'Your comment contained bad html.', err_too_frequent:'You must wait a few seconds between posting comments.', err_comment_empty:'Your comment was not posted because it was empty!', MAX_CHARS: 2048 }; </script> <!-- done customizing labels of htmlcommentbox.com --> <!-- begin htmlcommentbox.com --> <div id="HCB_comment_box"><a href="http://www.htmlcommentbox.com">HTML Comment Box</a> is loading comments...</div> <script type="text/javascript" language="javascript" id="hcb"> /*<!--*/ (function(){s=document.createElement("script");s.setAttribute("type","text/javascript");s.setAttribute("src", "http://www.htmlcommentbox.com/jread?page="+escape(window.location)+"&mod=%241%24wq1rdBcg%24Ap6g0Z.mMeL6OYEFezBnw."+"&opts=286&num=10");if (typeof s!="undefined") document.getElementsByTagName("head")[0].appendChild(s);})(); /*-->*/ </script> <!-- end htmlcommentbox.com --> </div> <div id="history"> <img src="images/title82.gif" alt="" width="404" height="0" /><br /> <p><strong><b></b></strong></p> <p></p> <p><strong><b></b></strong></p> <p></p> </div> </div> </div> <div id="footer"> </ul> <p>Copyright ©. All rights reserved. </p> </div> </body> </html> Hi, here's my code, and things are working as they should. My only problem is I can't seem to move my drop-down list from the cell it is in to the cell left one. (see photo) Can anyone see from my code whats going wrong? Site url: http://www.walthamforest-fc.co.uk/st...layer.php?id=3 Code: <TABLE WIDTH="520" ALIGN=center BORDER=0 CELLSPACING=0 CELLPADDING=0> <TR VALIGN=middle ALIGN=center> <td><img src="http://www.walthamforest-fc.co.uk/stats/images/playerbar.jpg"></TD> </TR> <tr VALIGN=left ALIGN=center> <td><img src=" <?php echo $image_url = "images/" . $playerdata['id'] . "_1.jpg"; ?>"/><img src=" <?php echo $image_url = "images/" . $playerdata['id'] . ".jpg"; ?>"/> </td></tr> <tr> <td background="/stats/images/playernameback.jpg" width="308" height="46"> <font face="Arial" size="4"><span style="letter-spacing: 0pt"><font color="#018609"> <?php echo "$playerdata[firstname]" ?> <?php echo "$playerdata[lastname]" ?> </TD> <td> <td background="/stats/images/playernameback.jpg" width="202" height="46"><?php // //Haetaan kaikki pelaajat dropdownia varten // $sql = ' SELECT P.PlayerID AS id, P.PlayerLastName AS lastname, P.PlayerFirstName AS firstname, P.PlayerPublish AS publish FROM tplss_seasons S LEFT OUTER JOIN tplss_players P ON P.PlayerID = S.SeasonPlayerID '; if($defaultseasonid == 0) { $sql .= " WHERE P.PlayerID != '' AND P.PlayerPublish = '1' GROUP BY id ORDER BY firstname, lastname"; } else { $sql .= " AND S.SeasonID = '$defaultseasonid' WHERE P.PlayerID != '' AND P.PlayerPublish = '1' GROUP BY id ORDER BY firstname, lastname"; } $query = mysql_query("$sql", $connection) or die(mysql_error()); echo"<select name=\"playerid\">"; while($data = mysql_fetch_array($query)) { if($data['id'] == $id) { echo"<option value=\"$data[id]\" SELECTED>$data[firstname] $data[lastname]</option>\n"; } else { echo"<option value=\"$data[id]\">$data[firstname] $data[lastname]</option>\n"; } } echo"</select> <input type=\"submit\" name=\"change_player\" value=\"$txt_change\">"; mysql_free_result($query); $ttl = (($_SESSION['getAdditional'] + 1) % 2) ? "Show": "Hide"; ?> </td> </tr> Hi: I have a long table (613 rows) with two columns (Containing Names, Addresses, Lot Numbers, and Phone Numbers, etc. I would like to format the cells of each column so that certtain fields (e.g., Phone Number is in a certain position in each cell). For example, I'd like this phone number to be right-aligned in the second row of each cell, etc Is there a standard, or easy way to do this ?? Thank for any help offered. -Mel Smith For some reason i can't resize the weight on the cells i highlighted in black on the code below Code: <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><table width="700" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="388" height="92" background="top11.jpg"> </td> <td width="312" height="92" background="top12.jpg"> </td> </tr> <tr> <td width="700" height="353" colspan="3" background="main.jpg"> </td> </tr> <tr> <td width="269" height="149"><a href="ImagensFinaisSite/picsleft/2.jpg" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('LeftPic','','ImagensFinaisSite/picsleft/2_on.jpg',1)" onClick="return popImage(this.href,'Site author');"><img src="ImagensFinaisSite/picsleft/2_off.jpg" alt="Clicar na imagem para ampliar" name="LeftPic" width="269" height="149" border="0" id="LeftPic"></a></td> <td width="157" height="149"><a href="ImagensFinaisSite/picscenter/1.jpg" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('CenterPic','','ImagensFinaisSite/picscenter/1_on.jpg',1)" onClick="return popImage(this.href,'Site author');"><img src="ImagensFinaisSite/picscenter/1_off.jpg" alt="Clicar na imagem para ampliar" name="CenterPic" width="157" height="149" border="0" id="CenterPic"></a></td> <td width="274" height="149"><a href="ImagensFinaisSite/picsright/2.jpg" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('RightPic','','ImagensFinaisSite/picsright/2_on.jpg',1)" onClick="return popImage(this.href,'Site author');"><img src="ImagensFinaisSite/picsright/2_off.jpg" alt="Clicar na imagem para ampliar" name="RightPic" width="274" height="149" border="0" id="RightPic"></a></td> </tr> </table></td> </tr> <tr> </tr> </table> These are the cells i can't resize: <td width="388" height="92" background="top11.jpg"> </td> <td width="312" height="92" background="top12.jpg"> </td> I've tried messing around with colspan but i just can't get it working. Any idea whats wrong? Hello, I made a goofy little website at adamvonwillis.com and if you look at the home page you will see a gap between the first and second rows. The rows need to be touching. If anyone could look at the code and help me out I would be very greatful! Thank you! Hi, I am developing a calendar application in ASP. The calendar is displayed in a table where each cell represents a date and has a + and - in it. The + represents people working on that date and the - those who are off. I need to add 'title' information to table cells so that when the user moves the cursor over the + or - the respective information to be shown. I tried to do this as follows: <td><title = "worklist">+</title><title="freelist">-</td> This doesn't work, nothing appears when the cursor hovers over either the + or -. I can combine the worklist and freelist and display it in one go with: <td title="listall">+=</title> but this is unsatisfactory. Too much data is displayed and the result looks messy. I dont want to double the amount of cells by having + and - in seperate cells either. Is there a trick that allows seperate <title> info in the same cell. Help would be appreciated, regards, Guy Is there any way to get text to float from one cell to the other? And if not, is there any other way i can solve the problem of getting text around a picture? example: <table> <tr> <td>text start</td> <td>picture</td> </tr> <tr> <td colspan="2">text end</td> </tr> </table Does anyone know the CSS or HTML (or combo) script to be able to have a table row collapse when there is no text in one cell, but there is text in the next cell? I have a 2-column table with titles in the left column and want the right column to be populated by a user. If the user doesn't populate the right cell(s) or row, I'd like that row -including the constant/visible text that is in the left col- to be hidden and that row to collapse or move up... Can anyone tell me why? Not sure what is going on here... Here is a link to the development site where you can see the problem I am having (I did not design it, but I am in charge of changing to html). http://www.vismarkgroup.com/dev/Kyrie/about.html Thanks!! Hi there, I was wondering if it's good practice to put <li> tags inside table cells. Normally, I would just put the list items in their own div container without the table, but for specific design reasons, I need to separate the list items in their own table data cells. This is how I'm currently doing it: Code: <div id="container"> <ul> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td><h2>List Header</h2></td> </tr> <tr> <td height="29"><li><a href="itemone.html">Item One</a></li></td> </tr> <tr> <td height="29"><li><a href="itemtwo.html">Item Two</a></li></td> </tr> <tr> <td height="29"><li><a href="itemthree.html">Item Three</a></li></td> </tr> <tr> </table> </ul> </div> Notice that the H2 header isn't actually a list item but is still within the <ul> tags. Is any of this confusing or incorrect for google indexing? Hi, I spent five and a half hours attempting to resolve this problem, but now I'm hoping that someone might be able to help me. If you visit http://www.justforyouwebsite.com/, you'll see that the menu tables on the left and right sidebars are meant to have shadows. The shadows are created by using 3x3 tables, with the right and bottom sides of the tables containing repeating background images. Unfortunately, however, the size of the table cells on the right isn't correct. The top-right cell should be 7 pixels high, with the middle right cell filling the space between the top right and bottom right cells. As it is now, the top right cell and the middle right cell appear to be split evenly, and no matter what style or HTML changes I make, there is no way to get the shadow to repeat all the way up the right side of the table. Does anyone have any ideas? The Smarty template code is below in case it might help someone, although I don't see how this could be a scripting problem. Code: <table cellspacing="0" cellpadding="0" border="0" width="100%"> <tr> <td colspan="2" rowspan="2"> <table cellspacing="1" width="100%" class="VertMenuBorder"> <tr> <td class="VertMenuTitle"> <table cellspacing="0" cellpadding="0" width="100%"><tr> <td>{$link_begin}<img src="{$ImagesDir}/{if $dingbats ne ''}{$dingbats}{else}spacer.gif{/if}" class="VertMenuTitleIcon" alt="{$menu_title|escape}" />{$link_end}</td> <td width="100%">{if $link_href}<a href="{$link_href}">{/if}<font class="VertMenuTitle">{$menu_title}</font>{if $link_href}</a>{/if}</td> </tr></table> </td> </tr> <tr> <td class="VertMenuBox"> <table cellpadding="{$cellpadding|default:"5"}" cellspacing="0" width="100%"> <tr><td>{$menu_content}<br /></td></tr> </table> </td></tr> </table> </td> <td class="TabTopRight" height="7px"><div class="DivTabTopRight" height="7px"> </div></td> </tr> <tr> <td class="TabRight" height="100%"><div class="DivTabRight"> </div></td> </tr> <tr> <td class="TabBottomLeft"><div class="DivTabBottomLeft"> </div></td> <td class="TabBottom"><div class="DivTabBottom"> </div></td> <td class="TabBottomRight"><div class="DivTabBottomRight"> </div></td> </tr> </table> Thanks, -Steve I am making a simple table with multiple links in each of the cells. The only problem is when I try to put 2 links in the same cell it turns out like this: Link Link, side by side. Is there a way to make them be a list (up and down) like this: Link Link Thanks in advance. Hello everyone! I'm so glad an informative forum like this exists! I'm in Web-115 and was looking for a little help on an assignment as i'm not sure how to do this. Below are the things i'm struggling with and below it is the code. Any help would be greatly appreciated! 9. "Assign the cell in the top-left corner of the table the id name topLeft. Assign the cell in the top-right corner the id name topRight." Not sure where to insert this into my morning.htm file 13. "add the following styles for the table cells" (not sure where to insert "topLeft, topRight, etc or what to use as id to be indentified in CSS" HTML Code: <table class="programs" summary="Lists the morning programs aired by KPAF from 5:00 a.m. to 12:00 p.m. (central time)"> <caption>All times central</caption> <thead> <colgroup> <col class="timeColumn" /> <col class="daysColumn" span="6" /> <col class="lastColumn" /> </colgroup> <tr> <th>Time</th> <th>Monday</th> <th>Tuesday</th> <th>Wednesday</th> <th>Thursday</th> <th>Friday</th> <th>Saturday</th> <th>Sunday</th> </tr> </thead> Thanks so much! Justin Moose Hello, I have a website that I'm having trouble with. The problem only shows up in Firefox. For some reason, a few cells in my tables are showing gaps between the borders and the JPG image within it. None of my tables or cells have any spacing or padding above 0. The cell heights aren't set to anything. Here's a screen shot for an example of what I mean: The gaps I'm referring to are where the red arrows are pointing. Now here's the same image with the borders of the tables within the problem region set to 1: Can anyone explain this? Is there are minimum cell height in Firefox or something? You can view my website at http://www.rrexecutivesuites.com (remember to view it in Firefox). Hello! This is my first post on the forum, seems like a nice place here. I'm pretty much brand new to HTML and CSS as well. I'm learning fast but I have run into a problem that I cannot solve... and maybe it is not even solve-able with HTML. I want to create a table that has a different amount of cells on each row, but I want those rows to have the same width. I understand it is hard to understand from my poor description. So check out the image below: This is how I want to table to look, how is it done? Thanks! Hello, Is it possible to create drop down menus from table cells (i.e., moving mouse over a cell activates a drop down menu)? If so, could you possibly point me to an example to see how it is done? Thanks! |