Question

I have a database and a table named status. A status of 0 means unread and a status of 1 means read If the status is 0 the individual row is supposed to turn lime. If it is 1 it’s white.

$colors = array("lime", "white");

echo "<style type=\"text/css\">";
echo "tr:hover {";
echo "background: #cc00ff;";
echo "color: white;";
echo "}";
echo "tr {";
echo "font-family: Verdana, Geneva, sans-serif;";
echo "font-size: 13px;";
echo "background: $colors[$status];";
echo "}";
echo "</style>";

the $status variable is set here:

while ($row = mysql_fetch_row($result))
        {
            echo "<tr>";
           //rows for <table>
            echo "</tr>";
            $status = $row[4];//status table either a 0 or 1
        }

However when the table row background is set it changes for all the table rows instead of just the row with a status of 0.

How can I make the individual rows change color depending on their status value?

Answer 1

This code is rendering multiple styles. Something like this

<style type=\"text/css\">
tr:hover {
background: #cc00ff;
color: white;
}
tr {
font-family: Verdana, Geneva, sans-serif;
font-size: 13px;
background: lime;
}
</style>

<style type=\"text/css\">
tr:hover {
background: #cc00ff;
color: white;
}
tr {
font-family: Verdana, Geneva, sans-serif;
font-size: 13px;
background: white;
}
</style>

<style type=\"text/css\">
tr:hover {
background: #cc00ff;
color: white;
}
tr {
font-family: Verdana, Geneva, sans-serif;
font-size: 13px;
background: lime;
}
</style>

...
...
...

Only the last one would take effect. This is not only wrong terribly inefficient also. Put the styles just once and then use the class in the tr tag when you need. Something like this

<style type=\"text/css\">
tr.white:hover {
    background: #cc00ff;
    color: white;
}
tr.white {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 13px;
    background: white;
}
tr.lime:hover {
    background: #cc00ff;
    color: lime;
}
tr.lime {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 13px;
    background: lime;
}
</style>

then render the appropriate html

while ($row = mysql_fetch_row($result))
{
    $status = $row[4];//status table either a 0 or 1

    echo "<tr class=\"$colors[$status]\">";
    //rows for <table>
    echo "</tr>";
}