php - How to apply nth-child to tables generated from database -
i'm having trouble setting css code table i'm generating using php database. want every row have different background-color, tried using nth-child(even) this, doesn't seem work reason. here's code:
style.css:
#usertable { border-collapse: collapse; font-family: "trebuchet ms", arial; } #usertable td, #usertable th { border: 1px solid black; background-color: rgb(228,227,227); padding: 8px; } #usertable tr:nth-child(odd){background-color: rgb(115,115,115);} admin.php:
<table id="usertable"> <tr> <th> id: </th> <th> username: </th> <th> rights: </th> </tr> <?php $userquery = "select id, username, strength users"; $result = $conn->query($userquery) or die($conn->error); while ($row = $result->fetch_assoc()) { ?> <tr> <td> <?php echo $row['id']; ?> </td> <td> <?php echo $row['username']; ?> </td> <td> <form method="post" action=""> <input type="number" min="0" max="255" name="newrights" value=" <?php echo $row['strength']; ?> "> <input type="text" name="idnumber" hidden="true" value=" <?php echo $row['id']; ?> "> <input type="text" name="usertochange" hidden="true" value=" <?php echo $row['username']; ?> "> <input type="submit" value="update"> </form> </td> </tr> <?php } ?> </table>
there markup error code
<table id="usertable"> <tr> <!--add this--> <th> id: </th> <th> username: </th> <th> rights: </th> </tr> <!--add this--> <?php $userquery = "select id, username, strength users"; $result = $conn->query($userquery) or die($conn->error); while ($row = $result->fetch_assoc()) { echo "<tr><td>" . $row['id'] . "</td><td>" . $row['username'] . "</td><td>"; echo "<form method=\"post\" action=\"\"> <input type=\"number\" min=\"0\" max=\"255\" name=\"newrights\" value=\"" . $row['strength'] . "\"> <input type=\"text\" name=\"idnumber\" hidden=\"true\" value=\"" . $row['id'] . "\"> <input type=\"text\" name=\"usertochange\" hidden=\"true\" value=\"" . $row['username'] . "\"> <input type=\"submit\" value=\"update\"> </form></td></tr>"; } ?> also looks have used many slaces suggest check table markup on browser
updated: add
#usertable td:nth-child(odd) { background-color: #efefef;} do not use tr have given background color td , th initially
Comments
Post a Comment