bajangerry Posted October 12, 2010 Share Posted October 12, 2010 Hi Guys, I have a query and a while loop output that I am sending to a webpage in a table format but I need some help in how best to do this so that the table columns line up with each other. Right now the column width seems to change depending on the data in the row. The code is quite simple: <?php include("lib/config.php"); $query = "SELECT * FROM staff_member"; $result = mysql_query($query); ?> <html> <style type="text/css"> <!-- @import url(style/style.css); --> </style> <head> </head> <body> <h2 align="center"> Full Staff list with Dependants</font></h2> <?php while($row = mysql_fetch_object($result)) { echo "<table id=sample> <th>Title</th> <th>First Name</th> <th>Initial</th> <th>Last</th> <th>Agency</th> <th>Street</th> <th>Address</th> <th>Parish</th> <th>Country</th> <th>Office Tel#</th> <th>Home Tel#</th> <th>Office Mobile#</th> <th>Personal Mobile#</th> <th>Zone</th> <th>Status</th> <th>Location</th> <th>Updated by</th> <tr> <td>" .$row->title ."</td> <td>" .$row->first ."</td> <td>" .$row->initial ."</td> <td>" .$row->last ."</td> <td>" .$row->agency ."</td> <td>" .$row->street ."</td> <td>" .$row->adress ."</td> <td>" .$row->parish ."</td> <td>" .$row->country ."</td> <td>" .$row->officetel ."</td> <td>" .$row->hometel ."</td> <td>" .$row->officemobile ."</td> <td>" .$row->personalmobile ."</td> <td>" .$row->zone ."</td> <td>" .$row->status ."</td> <td>" .$row->location ."</td> <td>" .$row->updater ."</td> </tr>"; echo "</table> </br>"; }//close $row while ?> </body> </html> Any help appreciated! Quote Link to comment Share on other sites More sharing options...
New Coder Posted October 12, 2010 Share Posted October 12, 2010 Personally for neatness I always structure a table like: <?php include("lib/config.php"); $query = "SELECT * FROM staff_member"; $result = mysql_query($query); ?> <html> <style type="text/css"> <!-- @import url(style/style.css); --> </style> <head> </head> <body> <h2 align="center"> Full Staff list with Dependants</font></h2> <?php $list = "<table align=\"center\" border=\"0\" width=\"99%\">"; $list .= "<tr>"; $list .= "<th>Title</th>"; $list .= "<th>First Name</th>"; $list .= "<th>Initial</th>"; $list .= "<th>Last</th>"; $list .= "<th>Agency</th>"; $list .= "<th>Street</th>"; $list .= "<th>Address</th>"; $list .= "<th>Parish</th>"; $list .= "<th>Country</th>"; $list .= "<th>Office Tel#</th>"; $list .= "<th>Home Tel#</th>"; $list .= "<th>Office Mobile#</th>"; $list .= "<th>Personal Mobile#</th>"; $list .= "<th>Zone</th>"; $list .= "<th>Status</th>"; $list .= "<th>Location</th>"; $list .= "<th>Updated by</th>"; $list .= "</tr>"; while($row = mysql_fetch_object($result)) { $list .= "<tr>"; $list .= "<td>" .$row->title ."</td>"; $list .= "<td>" .$row->first ."</td>"; $list .= "<td>" .$row->initial ."</td>"; $list .= "<td>" .$row->last ."</td>"; $list .= "<td>" .$row->agency ."</td>"; $list .= "<td>" .$row->street ."</td>"; $list .= "<td>" .$row->adress ."</td>"; $list .= "<td>" .$row->parish ."</td>"; $list .= "<td>" .$row->country ."</td>"; $list .= "<td>" .$row->officetel ."</td>"; $list .= "<td>" .$row->hometel ."</td>"; $list .= "<td>" .$row->officemobile ."</td>"; $list .= "<td>" .$row->personalmobile ."</td>"; $list .= "<td>" .$row->zone ."</td>"; $list .= "<td>" .$row->status ."</td>"; $list .= "<td>" .$row->location ."</td>"; $list .= "<td>" .$row->updater ."</td>"; $list .= "</tr>"; } $list .= "</table>"; echo $list; ?> </body> </html> You can then also uses classes in your css to format specific items: th.table{ text-align:center; font-size:75%; background-color:#00000; } and call like: $list .= "<th class=table>Title</th>"; not sure this is best practice but you can force the size of columns like: $list .= "<th class=table width=35%>Title</th>"; Quote Link to comment Share on other sites More sharing options...
bajangerry Posted October 12, 2010 Author Share Posted October 12, 2010 Thanks New Coder, I tried your code and it worked great but I am trying to get it to work using the CSS alone and I still don't seem to be able to get that to work for some reason. Will keep digging at it! Thanks again. Quote Link to comment Share on other sites More sharing options...
Pikachu2000 Posted October 12, 2010 Share Posted October 12, 2010 Your <table></table> tags are inside the while() loop, causing a new table to be created for each DB record. If you move them outside so all the records are in one table, the columns will will align with each other. You should also probably move the <tr> with all the <th>'s outside the loop also, unless you want a header row for each record (which you probably don't). Quote Link to comment Share on other sites More sharing options...
bajangerry Posted October 12, 2010 Author Share Posted October 12, 2010 Pikachu, I do actually have a reason for the table being inside the while loop and I know it is causing the problems I have by being there. I will eventually have a sub-table showing dependents for this initial table under each of the rows so I will need the header row for each in this configuration. I guess what I would ideally like to achieve is to force the initial table columns to be a set % size of the row but I am not sure how best to do this. Quote Link to comment Share on other sites More sharing options...
Pikachu2000 Posted October 12, 2010 Share Posted October 12, 2010 In that case, since you don't want to use the width parameter in the <td> tags, I've gone as far as I can. My CSS skills are nearly non-existent . . . Quote Link to comment Share on other sites More sharing options...
bajangerry Posted October 12, 2010 Author Share Posted October 12, 2010 Pikachu2000, You and me are together in that boat, thanks for the help anyway. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.