Page 1 of 1

How to prevent table being stretched?

Posted: Thu Jan 19, 2012 6:17 pm
by nielsenN
I want to prevent the table of the searched data being stretched. If there are many data that are searched, the table size is okay, but when there are small data that are being searched, it will display the data in the stretched table height which looks awkward. I need to know how to prevent the table from stretching.:(

Below are the codes.

Code: Select all

 <style type="text/css">
table{
background-color:#EBEBEB; /*background line table*/
}
th{
    width:150px;
    text-align:left;
    }

    </style>
    </head>

    <style type="text/css">
    table {
      table-layout:fixed;
         width:100%;
         border:0px solid ; 
         height:1px;


             word-wrap:break-word;
            overflow:scroll;
            }
            p   {font-size:9px}

         tbody { height:20em;  overflow:scroll; width:fixed;}
     td { height:auto;}

    </style>

    <body>


    <form method="post" action="searchschoolsthis.php">
    <input type="hidden" name="submitted" value="true" />

    <label><span class="style2">Pilih Kategori:</span>
    <span class="style1">
    <select name="category">
      <option value="negeri">NEGERI</option>
      <option value="daerah">DAERAH</option>
      <option value="kod_sekolah">KOD SEKOLAH</option>
    </select>
     </span></label>

     <span class="style1">
     <span class="style2">Taip Kriteria
     <label>:</label>
     </span>
     <label>
     <input type="text" name="criteria" onKeyUp="this.value = this.value.toUpperCase();"/>
     </label>
     <input type="submit" value="Cari" />
                </form>   


                <form action="php_excel_export.php?criteria=<?php echo($_POST['criteria']); ?>" method="post" name="criteria" target="_blank" id="cetak">
                 <input type="submit" name="cetak" id="cetak" value="Cetak" />
                </form>

     </span>


       <table width='100%' color='black' id='header'>

       <thead>
        <tr>
          <td width="40%" scope="col"><div align="center"><span class="style2">Kod Sekolah</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">Nama Sekolah</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">PTJ</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">Server</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">PC</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">NB</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">Mono Laser</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">Color Laser</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">Dot Matrix</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">LCD</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">Set LAN</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">Jumlah Kos</span></div></td> 
          <td width="40%" scope="col"><div align="center"><span class="style2">Dibayar</span></div></td> 
          <td width="50%" scope="col"><div align="center"><span class="style2">Tanggungan</span></div></td> 
        </tr>
      </thead>
        </table>


    <?php

    if(isset($_POST['submitted'])){

    include('connect.php');
    $category=$_POST['category'];
    $criteria=$_POST['criteria'];
    $query="SELECT * FROM schools WHERE $category = '$criteria'";
    $result=mysqli_query($dbcon,$query) or die('error getting data');


    echo "<table width='120%' border='2' color='black' id='header'>";


    while ($row = mysqli_fetch_array($result,MYSQL_ASSOC)){


    echo"<tr><td>";

    echo $row['kod_sekolah'];

    echo"</td><td>";    

    echo $row['nama_sekolah'];
    echo"</td><td>";

    echo $row['ptj'];
    echo"</td><td>";

    echo $row['server'];
    echo"</td><td>";

    echo $row['pc'];
    echo"</td><td>";

    echo $row['nb'];
    echo"</td><td>";

    echo $row['mono_laser'];
    echo"</td><td>";

    echo $row['color_laser'];
    echo"</td><td>";

    echo $row['dot_matrix'];
    echo"</td><td>";

    echo $row['lcd'];
    echo"</td><td>";

    echo $row['set_lan'];
    echo"</td><td>";

    echo $row['jumlah_kos'];
    echo"</td><td>";

    echo $row['dibayar'];
    echo"</td><td>";

    echo $row['tanggungan'];
    //echo"</td><td  style='text-align:right'>";

    echo"</td></tr>";

    }

    echo "</table>";

    }


    ?>


Re: How to prevent table being stretched?

Posted: Wed Mar 28, 2012 5:29 am
by social_experiment
Have you tried setting a minimum height?

Code: Select all

 min-height: 200px;