Jump to content

Table Alternate Row Color


Smee

Recommended Posts

Hi,

 

I am having some serious issues with my table. I can't for the life of me get it to color alternate rows, i have tried several tutorials and methods found on the Internet but none seem to resolve the issue of just a plain white background.

 

Can someone tell me what i am doing wrong because i have spent far to much time on this it's driving me crazy. Below i have shown the CSS and HTML i am using.

 

Thanks for the help

 

#index_newest_members table {

font-family:Tahoma, Geneva, sans-serif;

font-size: 12px;

font-weight: lighter;

padding: 0;

border-collapse: collapse;

text-align: center;

color: #000000;

line-height: 10px;

}

 

#index_newest_members td {

margin-left: 0;

padding: 12px 5px;

}

 

 

#index_newest_members th {

margin-left: 0;

}

 

#index_newest_members thead tr th {

font-family: Trebuchet MS;

font-weight: 600;

font-size: 12px;

font-style: normal;

padding:  12px 5px;

text-align:center;

}

 

#index_newest_members tfoot tr th, tfoot tr td {

background-color: transparent;

color: #ccc;

border-top: 1px solid #ccc;

padding: 20px 10px;

}

 

#index_newest_members tbody tr th td {

text-align: center;

}

 

#index_newest_members tbody tr td {

background: #FFF;

}

 

#index_newest_members tbody tr td.odd {

background: #CCC;

}

 

#index_newest_members tr:hover {

}

 

#index_newest_members tr:hover td, tr:hover td a, tr:hover th a {

color: #a10000;

}

 

#index_newest_members td:hover {

}

 

#index_newest_members table a {

color: #608117;

background-image: none;

text-decoration: none;

border-bottom: 1px dotted #8A8F95;

}

 

#index_newest_members table a:hover {

color: #BBC4CD;

background-image: none;

text-decoration: none;

border-bottom: 2px solid #333;

}

 

#index_newest_members table a:visited {

text-decoration: none;

border-bottom: 1px dotted #333;

text-decoration: none;

}

 

#index_newest_members table a:visited:hover {

background-image: none;

text-decoration: none;

border-bottom: 3px solid #333;

}

 

 

 

echo ('<table width="294" height="150" border="0" />

  <thead>

<tr>

<th scope="col">First Name</th>

<th scope="col">Post Code</th>

<th scope="col">Team Supported</th>

  </thead>

</tr>');

 

while($row = mysql_fetch_assoc($result))

  {

  echo ('

<tbody>  

  <tr>

  <td>' . $row['first_name'] . '</td>

  <td>' . $row['post_code'] . '</td>

  <td>' . $row['team_supported'] . '</td>

</tr>

</tbody>

');

  }

echo "</table>";

 

Link to comment
https://forums.phpfreaks.com/topic/204035-table-alternate-row-color/
Share on other sites

Please don't post PHP in the CSS section of the forum. PHP irrelevant to CSS, as CSS acts on HTML. Post the HTML output of your script. And please wrap your script in code tags, it makes it easier to read. You can highlight all your code, then click the # button above the textarea where you type your post, and it will add the code tags automatically for you.

 

As for your problem - you only have one row. So how are you expecting to alternate colors?

very easy

 

 

before while() set your color

assume this

$bg1="#FFFFFF";

$bg2="#000000";

$bg3=$bg1;

 

while loop

set your <td bgcolor=$bg3>

 

at the end of the loop set like this

if($bg3==$bg1){

$bg3=$bg2;}

elseif($bg3==$bg2){

$bg3=$bg1;}

 

as simple as that.hope it helps

And this what i did with your code

 

$bg1="#FFFFFF";

$bg2="#000000";

$bg3=$bg1;

while($row = mysql_fetch_assoc($result))

              {

              echo ('

                  <tbody>   

                    <tr>

                    <td bgcolor=$bg3>' . $row['first_name'] . '</td>

                    <td bgcolor=$bg3>' . $row['post_code'] . '</td>

                    <td bgcolor=$bg3>' . $row['team_supported'] . '</td>

                  </tr>

                  </tbody>

                  ');

              if($bg3==$bg1){

$bg3=$bg2;}

elseif($bg3==$bg2){

$bg3=$bg1;}

}

            echo "</table>";

Robert - please use code tags in the CSS section.

 

And learn PHP as

 

echo ('
                  <tbody>   
                    <tr>
                    <td bgcolor=$bg3>'

 

does not output what you think it will output.

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.