HTML - Table Color Issue

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

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">&nbsp;</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

Hey all.. I have an image that is not lining up in IE6, but does fine in FF...

Here's the code:

Code:

<table height="400px" bgcolor="#efefef" width="192px" cellpadding="0" cellspacing="0"><tr><td height="20%" >
<img src="images/module_header.gif" height="23px" width="190px" align="top" />
<a href="linkgoeshere.html" border="0" /> </a>
</td></tr>
<tr>
<td>
<center>
<img src="images/module_header.gif" height="23px" width="190px" />
<a href="http://bbsnews.net/bbsn_weather/current.php?config=&forecast=zandh&
pands=28792&Submit=GO" title="Commercial Free Weather at BBSNews.net">
<img valign="top" src="http://bbsnews.net/bbsn_weather/current.php?
forecast=hourly&pands=28792&config=png&alt=hwicc&hwvttf=BOGSTAND&
daysonly=1&hwvbg=efefef&hwvtc=black&hwvusettf=1" border=0 width=166 height=77></a>
 </center>
 </td></tr></table>
 </td></td></table>

And here's an image of what I mean.. The two module headers at the top should be to the right... above the other items. Help would be much appreciated..

Hello, I have a site that I am trying to work on and have an issue with a table that has been devided to allow for a sliced graphic and I cannot get the cells to come together even though I have put cellpadding and cellspacing to "0". you can view it he
http://www.silkwebsolutions.com/malyshbeck/ it is the same in Firefox and IE.

I have tried collapsing the border for table and td and nothing works. Any help would be greatly appreciated.

Thanks, S

this is the last time im gonna nag any1 over stupid stuff if i could just get some help on this last issue i wont bother the forum members with my nonsense anymore, i ordered 2 html books on amazon.com and a java book my site is 100% ready to go public except this 1 issue i have ....

I cant get my tables to properly work arround my flash menu ? you can see here if you minimize the window the table lets my flash menu move into my text it use to not do this but i dont know what i did...
http://www.freewebs.com/fallingrain11/outcome.html

the code im using for this is below ::

<tr><td bordercolor="#7FFC00"; align="left" Width="17%" valign="top">


<div id="object1" style="position:absolute; visibility:show; left:25px; top:-50px; z-index:2">
<a href="javascript:void" >

<object cellpadding="100";
classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,2,0"
width="143"
height="395">
<param name="BGCOLOR" value="#0">
<param name=movie value="irawr-flash-menu-vertical.swf">
<param name=quality value=high>

<embed src="irawr-flash-menu-vertical.swf"
quality=high
pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
type="application/x-shockwave-flash"
width="143"
height="395"
bgcolor="#0">
</embed>
</object>

</a></div>

If I have a table that has 2 columns and the second column has 1 row (rowspan="2") and the first column has 2 rows, how can I keep the rows in the first column aligned top regardless of the height of the second column?

Thanks~

Hiya,
I'm altering an existing template for somebody, and I'm having trouble getting it to validate because of the damn tables. I really don't use tables much in favor of a css based layout, so I have very little experience in trying to figure out what the validator is trying to communicate to me. It seems what it tells me contradicts itself! Arggg..

If anyone could provide some insight into this tables mess it would be beyond appreciated.

Thanks!

-Zach

(I've removed some of the superfluous stuff to make it a little simpler)

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US">
<head>
<title></title>

</head>
<body >
<div id="mainwrap">
  <div id="header">
    <div id="headermsg"></div>
    <div id="outer">
      <ul>
        <li> <span class="xb1"> <a href="express"> <b class="hidden">AA
                </b></a> </span> </li>
        <li> <span class="xb2"> <a href="full"> <b class="hidden"> BB </b></a> </span> </li>
        <li>
          <div class="xb3"> <a href="group"> <b class="hidden">CC </b></a> </div>
        </li>
        <li>
          <div class="xb4"> <a href="past"> <b class="hidden"> DD </b></a> </div>
        </li>
      </ul>
    </div>
    <!-- tab specific menu goes here -->
    <div id="submenu1"> <a href="display/menufilter/madhus" title="menu filter">menu
        filter</a> </div>
    <div id="submenu2"> <a href="account/home/at/madhus" title="my account">my
        account</a> &nbsp; <a href="services/login/at/madhus" title="log in">log
        in</a> </div>
    <!-- end tab specific menu -->
  </div>
  <!-- end header -->
  <div id="wrapper">
  <!-- Begin page layout table -->
  <table id="maintable" border="0" width="100%">
    <!-- headBoard menu goes here -->
    <tr>
      <td class="tdHead" colspan="3" valign="top"><!-- header row -->
        <div id="headBoard"><div class="headboardtitle">Hello</div></div></td>
    </tr>
     <tr>
    <td id="leftCol" valign="top"><div class="intro2"> </div>
        <div id="main">
          <div class="description">
            <p>Street Address
              <input type="text" name="street" value="" style="width: 200px" id="street"/>
              <br />
              City
              <input type="text" name="city" value="" style="width: 260px" id="city"/>
              <br />
              State
              <input type="text" name="state" value="" style="width: 124px" id="state"/>
              Zip
              <input type="text" name="zip" value="" style="width: 100px" id="zip"/>
            </p>
            <p style="background-color: #f8e081;"> <i>optional</i> <br />
              <textarea name="comments" cols="20" rows="7" style="float:right; margin-right: 20px;" id="comments"></textarea>
              Landmarks, cross streets, Special instructions <br />
              <br />
              <br />
              <br />
              <br />
              <br />
              Company
              <input type="text" name="company" value="" style="width: 235px;" id="company"/>
              <br />
              Suite
              <input type="text" name="suite" value="" size="13" id="suite"/>
              Floor
              <input type="text" name="floor" value="" size="13" id="floor" />
              <br />
              <input type="checkbox" name="Leave with doorman" id="doorman"/>
              Please leave with doorman if not home <br />
              <input type="checkbox" name="Call Before Delivery" id="call"/>
              No phone/intercom, please call before delivery </p>
            <a href="#">delete</a> </div>
  
        <div class="customize2"> <a href="#"> New Address </a> </div>
        <a href="#"> <b class="basketitem"> </b> </a>
    </div>
    
    </td>
    
    <td id="centerCol" valign="top"><!-- Center Column -->
        <div class="intro2"> </div>
        <div id="main2">
          <div class="description">
            <p> Street Address
              <input type="text" name="street" value="" style="width: 200px" id="street2"/>
              <br />
              City
              <input type="text" name="city" value="" style="width: 260px" id="city2"/>
              <br />
              State
              <input type="text" name="state" value="" style="width: 124px" id="state2"/>
              Zip
              <input type="text" name="zip" value="" style="width: 100px" id="zip2"/>
            </p>
            <p style="background-color: #f8e081;"> <i>optional</i> <br />
              <textarea name="comments" cols="20" rows="7" style="float:right; margin-right: 20px;" id="comments2">
</textarea>
              Landmarks, cross streets, Special instructions<br />
              <br />
              <br />
              <br />
              <br />
              <br />
              Company
              <input type="text" name="company" value="" style="width: 235px;" id="company2"/>
              <br />
              Suite
              <input type="text" name="suite" value="" size="13" id="suite2"/>
              Floor
              <input type="text" name="floor" value="" size="13" id="floor2"/>
              <br />
              <input type="checkbox" name="Leave with doorman" id="doorman2"/>
              Please leave with doorman if not home <br />
              <input type="checkbox" name="Call Before Delivery" id="call2"/>
              No phone/intercom, please call before delivery </p>
            <a href="#">delete</a> </div>
        </div>
        <div class="customize"> <a href="#"> Save Changes </a> </div>
        <a href="#"> <b class="basketactionbuttons"></b> </a> </td>
        </tr>
  </table>
</div>
</div>
<!-- end page layout table -->
<div id="footer">
  <p> <a href="display/contact/madhus" class="novisitedlink">Contact Us</a> &nbsp; | &nbsp; <a href="display/printmenu/madhus" class="novisitedlink">Print
      Menu</a> &nbsp; | &nbsp; <a href="display/faq/madhus" class="novisitedlink">FAQ</a> </p>
  <p class="smalltext">Powered by <a class="novisitedlink" href="http://www.letsorderonline.com/r/madhus">LetsOrderOnline.com</a></p>
</div>
</body>
</html>

Okay I have a table that has two rows and eight columns. I want to make a third row with only ONE column so that the third row is the length of the table. How do I go about doing that?

I think I've totally given up on this, but thought I still pick all of your brains. I'm working with a CMS that has hardcoded tables so that even when you have border="0", a border still shows up on the live page. It's absolutely driving me nuts. Here's what I'm aiming at: I want to place 5 photos going down the right-hand side of the page. The only way I have figured out how to do this is through a table, but the border shows and makes the entire page look like crap. Any other ideas on how I can accomplish this? Thanks!

Hi there.

Can anybody help me fix this issue.

At this test url you will see a simple table layout that I have built in Dreamweaver

http://www.mediaminx.com/development/

The css can be viewed here

http://www.mediaminx.com/development/pages/test.css

The problem is not Firefox as this renders the layout perfectly - as does 3 other popular browsers. The problem is IE - it just wont render the layout correctly. All the table cells are out of proportion and the css just isnt controlling.

Note that when the middle cell isnot split into may cells ie will render the table correctly - as in 3 columns with the middle one at 760pix and the two outer set to auto and the height set to 100%. But as soon as I start splitting that middle column it throws IE out?

Any ideas out there please?

This should be a pretty easy one, I think that I've just been staring at this for too long. The question is, why is the first row in this table so tall? I am expecting it to be around 400px tall, but it's about 950px.

HTML Code:

<html>
<head>
	<style>
	table.container{
		width: 1400px;
	}
	table.subcontainer{
		border: 1px solid #000;
		text-align: center;
		width: 100%;
	}
	td.container{
		background: #DDD;
		line-height: 4px;
		vertical-align: top;
	}
	</style>
</head>
<body>
<table class="container">
	<tr>
		<td class="container" rowspan="2" width="200"><table class="subcontainer">
			<tr>
				<td height="1000">Toolbar<br />1000 x 200</td>
			</tr>
		</table></td>
		<td class="container" width="400" rowspan="2"><table class="subcontainer">
			<tr>
				<td height="200">400 x 200</td>
			</tr>
		</table><br />
		<table class="subcontainer">
			<tr>
				<td height="400">400 x 400</td>
			</tr>
		</table><br />
		<table class="subcontainer">
			<tr>
				<td height="400">400 x 400</td>
			</tr>
		</table></td>
		<td class="container" colspan="2" width="800"><table class="subcontainer">
			<tr>
				<td height="400">800 x 400</td>
			</tr>
		</table></td>
	</tr>
	<tr>
		<td class="container" width="400"><table class="subcontainer">
			<tr>
				<td>400 x 200</td>
			</tr>
		</table></td>
		<td class="container" width="400"><table class="subcontainer">
			<tr>
				<td>400 x 200</td>
			</tr>
		</table></td>
	</tr>
</table>
</body>
</html>