HTML Table display horizontally/changing orientation

HTML Table display horizontally/changing orientation - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: HTML Table display horizontally/changing orientation (/showthread.php?tid=2507)

HTML Table display horizontally/changing orientation - El Forum - 08-09-2007

[eluser]Carlton[/eluser]
Is it possible to alter the orientation of a table....at the moment I have a table with 60+ columns and 2 rows so ideally would like to display it as 60+ rows and 2 columns. Similar to how you would layout a form I guess.

Is this possible using the table library at all?

HTML Table display horizontally/changing orientation - El Forum - 08-11-2007

[eluser]John_Betong[/eluser]

Quote:Is it possible to alter the orientation of a table....at the moment I have a table with 60+ columns and 2 rows so ideally would like to display it as 60+ rows and 2 columns. Similar to how you would layout a form I guess.

Is this possible using the table library at all?

 

Try putting the table into the following "<div " statement and change the values to suit your particular needs.

Code:
<div style='white-space:nowrap; overflow:auto;  width:22em; height:10em; background:#afa none'>

  <br />test stuff goes heretest stuff goes heretest stuff goes here

  <br />TEST STUFF GOES HERETEST STUFF GOES HERETEST STUFF GOES HERE

  <br />test stuff goes heretest stuff goes heretest stuff goes here

</div>

 

Tested in FireFox, Opera and IE6, no idea about Mac bowsers
 
Cheers,

John_Betong
 

HTML Table display horizontally/changing orientation - El Forum - 08-11-2007

[eluser]John_Betong[/eluser]
WHOOPS I completely missed the point and was way off on a tangent!

Never mind you now have an alternative to scroll horizontally Smile

Try this instead for a solution to list all your table fields vertically:

Code:
$sql    = 'select * from YOUR_TABLE_NAME_GOES_HERE';

  $query  = $this->db->query($sql);

  echo "<div style='position:relative; width:800px;'>";        

    foreach ($query->result() as $row):

      echo "<div style=' float:left; clear:right; width:20%; background:#ffa none'>";

        foreach($row as $line):

          echo '<p>';

            echo substr($line, 0, 142); // change to suit 

          echo '</p>';

        endforeach;  

      echo '</div>';  

    endforeach; 

  echo '</div>';

The idea of the second <div...> was to get the rows to display in a grid. If this is not required then rem out the start and finish of the <div...>.

Cheers,

John_Betong