the summary field is the longest and currently it uses a scroll bar instead of fitting it to one page. I can’t figure out to make the columns fit on one page without cutting of text. The relevant code is below.
<meta charset="utf-8">
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/bootstrap.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput.css" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput-typeahead.css" />
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/tagmanager/3.0.2/tagmanager.min.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/tagmanager/3.0.2/tagmanager.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="span12">
<h2 style="text-align:center"><strong>Explore Tracking Requests</strong></h2>
<div class="btn-text-right">
<form class="form-search pull-right" method="get">
<input type="text" name="query" class="input-medium search-query" value="<?php echo $search; ?>">
<button type="submit" class="btn">Search</button>
<a class="btn" type="submit" style= background-color:AliceBlue href="tracking.html">Home</a>
<a href="new_request2.html" class="btn btn-success" >New</a>
<div class="span6">
</div>
</div>
</div>
<div class="row">
</form>
</div>
<div class="">
<?php
// note: there may not be any data to display
if(empty($result_data))
{
echo "<p>Search didn't match any data.</p>";
}
else
{
// there is data to display
?>
<div class="table-responsive">
<table class="table table-striped table-bordered table-hover">
<thead>
<tr>
<?php
// since you are displaying all the columns, produce the output dynamically
foreach(array_keys($result_data[0]) as $col)
{
echo "<th>$col</th>";
}
?>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
foreach($result_data as $row)
{
echo '<tr>';
foreach($row as $value)
{
echo "<td>$value</td>";
}
echo '<td width=60>';
echo '<a class="btn btn-success" target=”_blank” href="edit.php?ID='.$row['ID'].'">Update</a>';
echo '</td>';
echo '</tr>';
}
}
?>
</tbody>
</table>
</div>
<div>
<?php
// output pagination links
echo $pagination_links;
?>
</div>
</div>
</div>
</div> <!-- /container -->
</body>
</html>