PHP MySQL Data arrangement in three rows of three columns
I want to get php mysql data arrangement in three rows of three columns, something like this 4f.lt (web).
<?php
requ开发者_C百科ire "lgsl_class.php";
$server_list = lgsl_query_cached_all("s");
$server_list = lgsl_sort_servers($server_list);
$output .= "
<div>
<table>";
foreach ($server_list as $server)
{
$misc = lgsl_server_misc($server);
$server = lgsl_server_html($server);
$output .= "
<tr>
<td align='center'>
<b>{$server['s']['name']}</b></td></tr>
<tr>
<td align='center'>
<img src='{$misc['image_map']}'/></td></tr>
<td align='center'>
<b>Map</b>: {$server['s']['map']}</td> </tr><tr><td align='center'>
<b>Players</b>:{$server['s']['players']} / {$server['s']['playersmax']}</td></tr>
<tr>
<td align='center'>
<b>Status</b>:<b><font color='green'> {$misc['text_status']}</font></b></td> </tr>
<td align='center'>
<a href='".lgsl_link($server['o']['id'])."'>
<font color='red'><b>More stats</b></font></a><hr></td></tr>
<tr>
";
}
$output .= "
</table>
</div>";
?>
With this script all i can get is one long column http://img28.imageshack.us/img28/40/exampleq.png (image) . The problem is that i cant find any example of this and i haven't got enough skill to do it myself. Thanks for any help.
A linear layout is caused by the </tr><tr>
tags. You have one after $server['s']['name']
, the line with <b>Players</b>
, and an orphan <tr>
at the end. Get rid of them and these will all be in one row.
Firstly your markup is a bit untidy and I'd be tempted to use a div with a float left class as in...
<div class="box">output goes in here</div>
For the css you need something like
.box {
width: 200px; /* or any dimension you like */
height: auto;
float: left;
border: 1px solid green;
}
The border property above is there just to see what's happening in the output. You can remove this once you're happy with the look and feel of the page.
OK now that's done just add the output you want to each of the divs...
<div class="box">first box content</div>
<div class="box">second box content</div>
<div class="box">third box content</div>
Lastly you've used font color green above, try to keep all your styling in a separate css file to keep things neat.
I hope this helps.
精彩评论