Hello,
I am trying to create an alternating table row color but it doesn't work. I wonder why?
index2.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Transdmin Light</title>
<!-- CSS -->
<link href="style/css/transdmin.css" rel="stylesheet" type="text/css" media="screen" />
<!--[if IE 6]><link rel="stylesheet" type="text/css" media="screen" href="style/css/ie6.css" /><![endif]-->
<!--[if IE 7]><link rel="stylesheet" type="text/css" media="screen" href="style/css/ie7.css" /><![endif]-->
<!-- JavaScripts-->
<script type="text/javascript" src="style/js/jquery.js"></script>
<script type="text/javascript" src="style/js/jNice.js"></script>
</head>
<body>
<div id="wrapper">
<!-- h1 tag stays for the logo, you can use the a tag for linking the index page -->
<h1><a href="#"><span>Transdmin Light</span></a></h1>
<img src="images/logo2.png" height="70px" style="margin-top: -30px; position: absolute;"><img src="images/admin.png" height="60px" style="margin: -20px 0 0 430px"><br><br>
<!-- You can name the links with lowercase, they will be transformed to uppercase by CSS, we prefered to name them with uppercase to have the same effect with disabled stylesheet -->
<ul id="mainNav">
<li><a href="#" class="active">DASHBOARD</a></li> <!-- Use the "active" class for the active menu item -->
<li><a href="#">ADMIN PAGE</a></li>
<li class="logout"><a href="#">LOGOUT</a></li>
<li class="logout"><a href="#"><img src="images/mail.png"></a></li>
<li class="logout"><a href="#">ADMIN</a></li>
</ul>
<!-- // #end mainNav -->
<div id="containerHolder">
<div id="container">
<div id="sidebar">
<ul class="sideNav">
<li><a href="#"><b>> Admin</b></a></li>
<li><a href="#" class="active">Group Management</a></li>
<li><a href="#">Student Management</a></li>
<li><a href="#">Materials</a></li>
<li><a href="#">Create Schedule</a></li>
<li><a href="#">Study Report</a></li>
<li><a href="#">Exercise</a></li>
<li><a href="#">Messaging</a></li>
<li><a href="#"><b>> Settings</b></a></li>
<li><a href="#" class="active">Access Level ID</a></li>
<li><a href="#">Package</a></li>
<li><a href="#">Static Content</a></li>
<li><a href="#">Image Gallery</a></li>
<li><a href="#">File Manager</a></li>
<li><a href="#">Database</a></li>
<li><a href="#">Level</a></li>
<li><a href="#">Auto Messaging</a></li>
</ul>
<!-- // .sideNav -->
</div>
<!-- // #sidebar -->
<!-- h2 stays for breadcrumbs -->
<h2><a href="#">Dashboard</a> » <a href="#" class="active">Group Management</a></h2>
<div id="main">
<form action="" class="jNice">
<h3>Group Management</h3><!--
<table cellpadding="0" cellspacing="0">
<tr>
<td>Vivamus rutrum nibh in felis tristique vulputate</td>
<td class="action"><a href="#" class="view">View</a><a href="#" class="edit">Edit</a><a href="#" class="delete">Delete</a></td>
</tr>
<tr class="odd">
<td>Duis adipiscing lorem iaculis nunc</td>
<td class="action"><a href="#" class="view">View</a><a href="#" class="edit">Edit</a><a href="#" class="delete">Delete</a></td>
</tr>
<tr>
<td>Donec sit amet nisi ac magna varius tempus</td>
<td class="action"><a href="#" class="view">View</a><a href="#" class="edit">Edit</a><a href="#" class="delete">Delete</a></td>
</tr>
<tr class="odd">
<td>Duis ultricies laoreet felis</td>
<td class="action"><a href="#" class="view">View</a><a href="#" class="edit">Edit</a><a href="#" class="delete">Delete</a></td>
</tr>
<tr>
<td>Vivamus rutrum nibh in felis tristique vulputate</td>
<td class="action"><a href="#" class="view">View</a><a href="#" class="edit">Edit</a><a href="#" class="delete">Delete</a></td>
</tr>
</table> -->
<!-- New Insert -->
<div id="inputberita">
<p> </p>
<p> </p><center>
<?php
include('includes/koneksi.php');
//Hapus berita
if (!empty($_GET['group_id']))
{
$group_id = $_GET['group_id'];
$result = mysql_query("DELETE FROM `group` WHERE group_id=".$group_id) or die(mysql_error());
$confirmation = !$result ? "Fail to delete data." : "Data has been deleted.";
}
?>
<div align="center">
<div style="width:700px;text-align:left;padding-top:5px;">
<?php if (isset($confirmation)) { echo $confirmation; } ?>
<form method="get" action="<?php $_SERVER['PHP_SELF'] ?>">
<br/>
<button type="button" onClick="parent.location='groupinfo_edit.php'">Add New Group</button><br><br>
<?php
//LOAD GROUP
$result = mysql_query("SELECT * FROM `group` ORDER BY group_id ASC") or die(mysql_error());
?>
<table id="admintable" border="1" cellpadding="2" cellspacing="0" width="800">
<tr>
<th>Group Name</th><th>Group Information</th><th>Package</th><th>Level</th><th>Teacher</th><th>Members</th><th>Payment</th><th>Post</th>
</tr>
<?php
$i=0;
while ($data = mysql_fetch_array($result)){
$result2=($i%2)?'#fbfbfb':'white';
//echo "<tr bgcolor='$result2'>";
//echo '<td>'.$data['page'].'</td>';
//echo "<td><a href='post.php?post_id=".$data['post_ID']."'><img src='../images/post.jpg'></a></td>";
//echo '</tr>';
echo "<tr bgcolor='$result2'>";
echo '<td><a href="groupinfo_edit.php?group_id='.$data['group_id'].'">'.$data['group_name'].'</a></td>';
echo '<td>'.$data['group_info'].'</td>';
echo '<td>'.$data['group_package'].'</td>';
echo '<td>'.$data['group_level'].'</td>';
echo '<td>'.$data['group_teacher'].'</td>';
//LOAD MEMBERS
$resultG = mysql_query("SELECT * FROM `student` INNER JOIN `group`
ON student.group_id = group.group_id
WHERE `group_name` ='".$data['group_name']."'") or die(mysql_error());
echo '<td>';
while ($data2 = mysql_fetch_array($resultG)){
echo '<a href="studentinfo.php?student_id='.$data2['student_id'].'">'.$data2['stu_fname'].' '.$data2['stu_lname'].'</a><br>';
}
echo '</td>';
echo '<td>'.$data['group_payment'].'</td>';
echo '<td><center><a href="groupmgt.php?group_id='.$data['group_id'].'">Delete</center></td>';
echo '</tr>';
$i++;
}
?>
</table>
</form>
</div>
</div>
</center>
</div>
</div>
<!-- End Insert -->
</form>
</div>
<!-- // #main -->
<div class="clear"></div>
</div>
<!-- // #container -->
</div>
<!-- // #containerHolder -->
<p id="footer">Feel free to use and customize it. <a href="http://www.perspectived.com">Credit is appreciated.</a></p>
</div>
<!-- // #wrapper -->
</body>
</html>
transdmin.css
@import url("reset.css");
@import url("layout.css");
@import url("jNice.css");
@import url("hack.css");
layout.css
/* Content ---------------------------------------- */
#main {
width: 700px;
float: right;
padding: 0 19px 0 0;
}
h3 {
font-size: 14px;
line-height: 14px;
font-weight: bold;
color: #5494af;
padding: 0 0 0 10px;
margin: 20px 0 10px;
}
#main table {
border-top: 1px solid #ddd;
width: 700px;
}
#main table tr td { /*
background: #f6f6f6; */
padding: 0px 20px;
height: 29px;
line-height: 29px;
border-bottom: 1px solid #ddd;
}
#main table tr.odd td {
background: #fbfbfb;
}
#main table tr:hover td { background: #fdfcf6; }
#main table .action {
text-align: right;
padding: 0 20px 0 10px;
}
#main table tr .action a { margin: 0 0 0 10px; text-decoration: none; color: #9b9b9b; }
#main table tr:hover .action .edit { color: #c5a059; }
#main table tr:hover .action .delete { color: #a02b2b; }
#main table tr:hover .action .view { color: #55a34a; }
#main table tr:hover .action a:hover { text-decoration: underline; }
#main fieldset {
border: 1px solid #ddd;
padding: 19px;
margin: 0 0 20px 0;
background: #fbfbfb;
}
#main fieldset p { margin: 0 0 14px 0; float: left; width: 100%; }
#main fieldset label {
display: block;
width: 100%;
margin: 0 0 7px 0;
line-height: 12px;
}
#main fieldset .text-long {
border: 1px solid #ddd;
background: #fff url(../img/input-shaddow.gif) no-repeat left top;
font: 11px Arial, Helvetica, sans-serif;
color: #646464;
padding: 5px 7px;
width: 264px;
float: left;
margin: 0 10px 0 0;
}
#main fieldset .text-medium {
border: 1px solid #ddd;
background: #fff url(../img/input-shaddow.gif) no-repeat left top;
font: 11px Arial, Helvetica, sans-serif;
color: #646464;
padding: 5px 7px;
width: 124px;
float: left;
margin: 0 10px 0 0;
}
#main fieldset .text-small {
border: 1px solid #ddd;
background: #fff url(../img/input-shaddow.gif) no-repeat left top;
font: 11px Arial, Helvetica, sans-serif;
color: #646464;
padding: 5px 7px;
width: 44px;
float: left;
margin: 0 10px 0 0;
}
#main fieldset .text-long:focus,
#main fieldset .text-medium:focus,
#main fieldset .text-small:focus,
#main fieldset textarea:focus { background: #fdfcf6 url(../img/input-shaddow-hover.gif) no-repeat left top; }
#main fieldset textarea {
border: 1px solid #ddd;
background: #fff url(../img/input-shaddow.gif) no-repeat left top;
font: 11px Arial, Helvetica, sans-serif;
color: #646464;
padding: 5px 7px;
width: 364px;
float: left;
margin: 0 10px 0 0;
height: 148px;
overflow: hidden;
}
.button-submit {
font: 11px Arial, Helvetica, sans-serif;
color: #646464;
width: 94px;
height: 29px;
cursor: pointer;
border: none;
background: url(../img/button-submit.gif) no-repeat left top;
}