responsive table not working with bootstrap

Question

i am building php website with bootstrap.i use the class .table-responsive to make a responsive table but in this specific page it is not responsive at all.i used this code in an other page and is working like charm

here is my code

<?php
include ('lheader.php');
require ('conntodb.php');

session_start();
$recs= $conn->prepare('SELECT st_id, name, address, telephone, nop, noi  

FROM magazia WHERE user_id = :user_id');
$recs->bindParam(':user_id', $_SESSION['user_id']);
$recs->execute();
$res= $recs->fetch(PDO::FETCH_ASSOC);
$_SESSION['st_id'] = $res['st_id'];
$_SESSION['name'] = $res['name'];
$_SESSION['address'] = $res['address'];
$_SESSION['telephone'] = $res['telephone'];
$_SESSION['nop'] = $res['nop'];
$_SESSION['noi'] = $res['noi'];


if (isset($_POST['submitted'])) {
if($_SESSION['noi'] < 3){
$noi=$_SESSION['noi'];
$noi++;
$errors = array();

$imgFile = $_FILES['st_im']['name'];
$tmp_dir = $_FILES['st_im']['tmp_name'];
$imgSize = $_FILES['st_im']['size'];
if (empty($_FILES['st_im'])) {
$errors[] = 'you forgot the picture!';
}else{

$upload_dir = 'users_uploads/'; // upload directory

$imgExt = strtolower(pathinfo($imgFile,PATHINFO_EXTENSION)); // get image extension

// valid image extensions
 $valid_extensions = array('jpeg', 'jpg', 'png', 'gif'); // valid extensions

     // rename uploading image
     $st_im = rand(1000,1000000).".".$imgExt;
 }
     if(in_array($imgExt, $valid_extensions)){
 // Check file size '5MB'
if($imgSize < 5000000)    {
move_uploaded_file($tmp_dir,$upload_dir.$st_im);
}
else{
$errors[] = "Sorry, your file is too large.";
}
}
else{
$errors[] = "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
}
if (empty($errors)){
 $conn->beginTransaction();

 try{
$stmt1=$conn->prepare("INSERT INTO images (st_id, image) VALUES  (:st_id,:st_im)");
 $stmt1->bindParam(':st_id', $st_id, PDO::PARAM_INT);
 $stmt1->bindParam(':st_im', $st_im, PDO::PARAM_STR);
 $st_im= $st_im;
 $st_id=$_SESSION['st_id'];
  $stmt1 ->execute();

  $stmt=$conn->prepare("UPDATE magazia SET noi= :noi WHERE st_id= :st_id");
  $stmt->bindParam(':st_id', $_SESSION['st_id'], PDO::PARAM_INT);
  $stmt->bindParam(':noi', $noi, PDO::PARAM_INT);
  $stmt->execute();
 $conn->commit();

  echo "New records created successfully";
 }catch(Exception $e){
 //An exception has occured, which means that one of our database queries
  //failed.
  //Print out the error message.
  echo $e->getMessage();
  //Rollback the transaction.
   $conn->rollBack();
    }
     }
    else { // Report the errors.

   echo '<h1>Σφάλμα</h1>
   <p class="error">Παρουσιάστηκαν τα παρακάτω σφάλματα:<br />';
    foreach ($errors as $msg) { // Print each error.
       echo " - $msg<br />\n";
    }
     echo '</p><p>Παρακαλώ ξαναπροσπαθήστε!</p><p><br /></p>';

     }
  }else {
echo "Μπορείτε να ανεβάσετε μεχρι 3 φωτογραφίες";
  }
 }
 ?>
 <div class="mainbody">

 <h4>Καλώς Ήρθατε <?php echo $_SESSION['fullname'];?></h4>
 <div class="container">
  <h4>Στοιχεία</h4>
 <div class="table-responsive">
  <table class="table">
    <thead>
      <tr>

 <th>Ονοματεπώνυμο</th>
                <th>Όνομα</th>
                <th>Διεύθυνση</th>
                <th>Τηλέφωνο</th>


      </tr>
    </thead>
    <tbody>
      <tr>
        <td><?php echo $_SESSION['fullname'];?></td>
        <td><?php echo $_SESSION['name'];?></td>
        <td><?php echo $_SESSION['address'];?></td>
        <td><?php echo $_SESSION['telephone'];?></td>

      </tr>
    </tbody>
  </table>
  </div>
</div>

i have also tryied the @media rule as it specified in

http://getbootstrap.com/2.3.2/scaffolding.html#responsive

but is not working

what am i missing?

thanks in advance!

Answer 1

You're not missing anything.
It's just that you and Twitter Bootstrap have different definitions for responsive.

With .table-responsive applied, the table will be horizontally scroll-able on small devices (under 768px, if you haven't changed the responsiveness breakpoints).

When viewing on anything larger than 768px wide, there is no difference.

See documentation and examples here.