简体   繁体   中英

How to format table rows into 2 columns

Please excuse me if this question is elementary - fairly new to working with mysql. I left out the query and loop/references in the code below, because my question is on formatting the table. (I hope that info isn't needed)

Right now the result of the code below is the info being displayed in one single table row that spans the width of the table, these rows continue until all data is displayed.

How can I format this so instead of one long cell in one table row, I get two cells per table row?

I haven't been able to figure out if this is a matter of formatting the table into 2 columns or formatting the tr or td.

Thank you very much for your help and guidance on this!!

echo('<table width="85%" align="center" cellspacing="15">');
//query,loop, references

   echo('<tr>
      <td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px">
         <div style="float:right">
            <form action="index.php" method="get">
                                <input type="hidden" name="page" value="viewproject">
                                <input type="hidden" name="projectid" value="'.$projectid.'">
                                <input type="submit" value="View Event"></form>
                        <br>
                <form action="jump_delete.php" method="post" align="right">
                                <input type="hidden" name="projectid" value="'.$projectid.'">
                                <input type="submit" value="Delete"></form>
         </div>
         <div style="font-weight:bold; font-size:18px">'.$projectclient.'</div>
            <div style="font-size:15px"><b>Event:</b> '.$projectname.'</div>
            <div style="font-size:15px">Date: '.$duedateformatted.'</div>
            <div style="font-size:15px">Staff Count: '.$projectstaffcount.'</div>
      </td>
    </tr>');

UPDATE: With using my own version of the help from below - I came to an answer that gets the job done for me. Thanks to all who chimed in with help and advice!!! Using an if statement to create when new rows happen.

if($i % 2 == 1) {
   if($i != 0) {
        echo(‘</tr>');
    }

tr add rows to you table
td add cells inside a row tr

Assuming you need the additional cell after the second form, you will need an additional <td></td>

echo('<table width="85%" align="center" cellspacing="15">');
//query,loop, references

   echo('<tr>
      <td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px">
         <div style="float:right">
            <form action="index.php" method="get">
                <input type="hidden" name="page" value="viewproject">
                <input type="hidden" name="projectid" value="'.$projectid.'">
                <input type="submit" value="View Event"></form>
                <br>
            <form action="jump_delete.php" method="post" align="right">
                <input type="hidden" name="projectid" value="'.$projectid.'">
                <input type="submit" value="Delete"></form>
         </div>
              // Additional td here
      </td>
      <td>
         <div style="font-weight:bold; font-size:18px">'.$projectclient.'</div>
            <div style="font-size:15px"><b>Event:</b> '.$projectname.'</div>
            <div style="font-size:15px">Date: '.$duedateformatted.'</div>
            <div style="font-size:15px">Staff Count: '.$projectstaffcount.'</div>
      </td>
    </tr>');

td means table data which is basically a cell or column

tr stands for table row

The number of td inside your tr will determine how many columns you are going to get.

Also, have a look at the td attribute colspan and rowspan here

In your specific case my guess is that you want to add another td inside your table

<table width="85%" align="center" cellspacing="15">
    <tr>
        <td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px"></td>
        <td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px"></td>
    </tr>
</table>

UPDATE: to loop through your data you need something like this

echo '<table width="85%" align="center" cellspacing="15">';
echo '<tr>';
$i = 0;
while(...) {
    // skip the first iteration
    // then after every second <td> close the <tr> and open a newone
    if($i > 0 and $i % 2 == 0) {
        echo '</tr><tr>';
    }
    echo '<td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px"></td>';
    $i++;
}
echo '</tr>';
echo '</table>';

Try to avoid echo for html code, and use tr for rows and td for I shall post the code how it works for me:

?>
<table width="85%" align="center" cellspacing="15">
  <?php
  //query,loop, references
  ?>
    <tr>
      <td bgcolor="#dddddd" style="border:1px solid black; padding:12px;">
        <form action="index.php" method="get">
          <input type="hidden" name="page" value="viewproject">
          <input type="hidden" name="projectid" value="<?php $echo projectid;?>">
          <input type="submit" value="View Event">
        </form>
      </td>
      <td>
        <form action="jump_delete.php" method="post" align="right">
          <input type="hidden" name="projectid" value="<?php $echo projectid;?>">
          <input type="submit" value="Delete">
        </form>
      </td>
    </tr>
    <tr>
      <td style="font-weight:bold; font-size:18px;">
        <?php echo $projectclient;?>
      </td>
      <td style="font-size:15px">
         Event:<?php echo $projectname;?>
      </td>
    </tr>
    <tr>
      <td style="font-size:15px">
        Date: <?php echo $duedateformatted;?>
      </td>
      <td style="font-size:15px">
        Staff Count: <?php echo $projectstaffcount;?>
      </td>
    </tr>
    <?php
    //close loop
    ?>
</table>
<?php

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM