[BootStrap] Création tableau responsive

bonjour quelqu'un aider pour afficher la liste des articles selon base sql avec une table resposive boostrap

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<div class="container">
    <div class="row">
 
 
        <div class="col-md-10 col-md-offset-1">
 
            <div class="panel panel-default panel-table">
              <div class="panel-heading">
                <div class="row">
                  <div class="col col-xs-6">
 
                  </div>
 
                </div>
              </div>
              <div class="panel-body">
                <table class="table table-striped table-bordered table-list">
                  <thead>
                    <tr>
                        <th><em class="fa fa-cog"></em></th>
                        <th class="hidden-xs">numero</th>
                        <th>Nom article</th>
                        <th>quantite</th>
						<th>date mise en stock</th>
						<th>quantite restante</th>
                    </tr> 
                  </thead>
                  <tbody>
                          <tr>
                            <td align="center">
                              <a class="btn btn-default"><em class="fa fa-pencil"></em></a>
                              <a class="btn btn-danger"><em class="fa fa-trash"></em></a>
                            </td>
                            <td class="hidden-xs">1</td>
                            <?php
include("connection.php");
$reqt=mysql_query("select * from `article` " );
while($row=mysql_fetch_array($reqt))
{
$id_art=$row[0];
$nomart=$row[1];
$qteart=$row[2];
$date_achat=$row[3];
$qte_rest=$row[3];
 
?>
 
 
 
	   <tr>  
	   <td><?php echo"$id_art";?></td>
        <td><?php echo"$nomart";?></td>
        <td><?php echo"$qteart";?></td>
       <td><?php echo"$date_achat";?></td>
	 <td><?php echo"$qte_rest";?></td>
		<td><?php echo"<a href=supprime_com.php?id_art=$id_art><img src='images/slider/sup.png'></a>"; ?></td>
		<td><?php echo"<a href=modif_com.php?id_art=$id_art><img src='images/slider/mod.png'></a>"; ?></td>
 
		</tr>
 
    <?php }?>
                          </tr>
 
                        </tbody>
                </table>
 
 
 
</div></div>
</div>
	</div></div>
</center>

et css soit

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
body{background:lightgray}
.panel-table .panel-body{
  padding:0;
}
 
.panel-table .panel-body .table-bordered{
  border-style: none;
  margin:0;
}
 
.panel-table .panel-body .table-bordered > thead > tr > th:first-of-type {
    text-align:center;
    width: 100px;
}
 
.panel-table .panel-body .table-bordered > thead > tr > th:last-of-type,
.panel-table .panel-body .table-bordered > tbody > tr > td:last-of-type {
  border-right: 0px;
}
 
.panel-table .panel-body .table-bordered > thead > tr > th:first-of-type,
.panel-table .panel-body .table-bordered > tbody > tr > td:first-of-type {
  border-left: 0px;
}
 
.panel-table .panel-body .table-bordered > tbody > tr:first-of-type > td{
  border-bottom: 0px;
}
 
.panel-table .panel-body .table-bordered > thead > tr:first-of-type > th{
  border-top: 0px;
}
 
.panel-table .panel-footer .pagination{
  margin:0; 
}
 
/*
used to vertically center elements, may need modification if you're not using default sizes.
*/
.panel-table .panel-footer .col{
 line-height: 34px;
 height: 34px;
}
 
.panel-table .panel-heading .col h3{
 line-height: 30px;
 height: 30px;
}
 
.panel-table .panel-body .table-bordered > tbody > tr > td{
  line-height: 34px;
}