Place php code inside floating css container(s)? - php

Question

i have a question in regards to php and css layers.
i have the following php code:
session_start();
// Retrieve all the data from the table
$SQL = "SELECT * FROM Exodus_planets WHERE login_id = $user[login_id] LIMIT 10";
$result = mysql_query($SQL);
//while ($db_field = mysql_fetch_assoc($result)) {
//print $db_field['planet_name'] . "<BR>";
//print $db_field['location'] . "<BR>";
while($row = mysql_fetch_array( $result )){
echo " Planet, ".$row['planet_name'];
echo " is located at System ".$row['location'];
echo "<br> ";
}
which correctly displays a word [Planet name] and a number [System] in sequence.
The above code displays the information in rows such as;
Planet Sun is located in system 35.
Planet Saturn is located in system 30.
i'm just trying to make this information display a look a little nicer. in a way so planet name shows up in the right of a background image container and system in another corner possibly colored.
....
How do i place the above code inside floating css container(s)?
Thank you.

Answer 1

As it seems to be a list of planets, I would use an HTML list. You can edit the css to have it look the way you want after.
echo ' <ul class="planetList"> ';
while($row = mysql_fetch_array( $result )){
echo '<li>';
echo " Planet, ".$row['planet_name'];
echo " is located at System ".$row['location'];
echo '</li> ';
}
echo '</ul>';
In CSS
ul.planetList {
display:block;
float:right;
background-image:url('yourBackground.jpg');
background-position:left;
background-repeat:repeat-y;
/* CSS 3 Only */
background-size:{length of your text}px 100%;
}
You could also use a table instead of the list. This way, you could get a background for the planet column, and another one for the located at sytem one.
echo ' <table> ';
echo ' <tr><th>Planet</th><th>System</th></tr>';
while($row = mysql_fetch_array( $result )){
echo '<tr>';
echo '<td class="planet">' . $row['planet_name'] . '</td>';
echo '<td class="system">' . $row['location'] . '</td>';
echo '</tr> ';
}
echo '</table>';
CSS :
table>tr.planet {
background-image:url('yourBackground.jpg');
background-position:left;
}
table>tr.system {
background-color:#CCFF00;
}

Answer 2

Php code should be inside tags. You can always close these tags and put some htmls tags
Example:
<div class="bla"><?php
my code
?></div>
Obviusly you can do everything in php
<?php
echo '<div class="bla">';
....phpcode....
echo '</div>';
?>
Hopefully this helps

Answer 3

You can do something like this to keep your code clean
<?php
session_start();
// Retrieve all the data from the table
$SQL = "SELECT * FROM Exodus_planets WHERE login_id = $user[login_id] LIMIT 10";
$result = mysql_query($SQL);
$planets = array();
while($row = mysql_fetch_array( $result )){
$planets[] = $row;
}
foreach($planets as $planet): ?>
<div class="prettyFloatyDiv">
Planet, <?php echo $planet['planet_name']?>
is located at System <?php echo $planet['location']?>
<br/>
</div>
<?php endforeach; ?>
If you have short tags enabled, you can replace every <?php echo with <?=