0
表格不适合屏幕显示。尝试与大多数的组合，但没有奏效。 业余，需要帮助。无法在引导程序页面上安装表格列
我不知道怎么回事错误也许有些愚蠢的错误，没能找到任何错误
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Generate</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header" >
<a class="navbar-brand" href="index.html"> <img alt="Brand" src="slideshow/img.png" style="height: 40px; display: inline-block; margin-top: -5px"> </a>
</div>
<ul class="nav navbar-nav" >
<li class="active"><a href="index.html">Home</a></li>
<li><a href="about.html">Generate POR</a></li>
<li><a href="Update\Adminlogin.html">Update POR</a></li>
<li><a href="video.html">Help</a></li>
<li><a href="contact.html">Contact us</a></li>
</ul>
<form class="navbar-form navbar-right">
<div class="form-group" id="demo">
<input type="text" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
<form class="navbar-form navbar-right">
<div class="form-group" id="txt1" style="color: aliceblue; margin-top: -5px" >
</div>
</form>
</div>
</nav>
<div class="col-md-8 col-md-offset-2">
<div class="row">
<form>
<div class="col-sm-12">
<div class="row">
<div class="col-sm-6 form-group">
<label>P O Date</label>
<input type="date" class="form-control">
</div>
<div class="col-sm-6 form-group">
<label>Category</label>
<select class="form-control" >
<option>Technology</option>
<option>Business</option>
<option>Development</option>
<option>Process</option>
</select>
</div>
</div>
</div>
<div class="col-sm-12">
<div class="row">
<div class="col-sm-6 form-group">
<label>Location</label>
<select class="form-control" >
<option>Bengaluru</option>
<option>Mumbai</option>
<option>Pune</option>
</select>
</div>
<div class="col-sm-3 form-group">
<label>Type of training</label>
<select class="form-control" >
<option>RBI</option>
<option>PST</option>
<option>Org needs</option>
</select>
</div>
<div class="col-sm-3 form-group">
<label>Venue Details</label>
<select class="form-control" >
<option>Mumbai</option>
<option>Bengluru</option>
<option>Pune</option>
</select>
</div>
</div>
</div>
<div class="col-sm-12">
<div class="row">
<div class="col-sm-6 form-group">
<div class="form-group">
<label>Vendor Address</label>
<textarea placeholder="Vendor Address Here.." rows="3" class="form-control"></textarea>
</div>
</div>
<div class="col-sm-6 form-group">
<div class="form-group">
<label>Billing Address</label>
<br>
Billing Address :<br>
Quinnox Consultancy Services Ltd.;<br>
Unit 170,SDF VI, SEEPZ SEZ,<br>
Andheri(East), Mumbai-400096<br>
</div>
</div>
</div>
</div>
表的显示心不是好下面的部分是问题
table doest fit on the screen
<div class="col-sm-12">
<div class="row">
<table class="table table-condensed table-striped table-hover" align="center">
<thead class="thead-inverse">
<tr>
<div class="form-group">
<th>Subject</th>
<th>Faculty</th>
<th colspan="2" align="center">Date</th>
<th>Days</th>
<th>Batch Size</th>
<th>Rate per day</th>
<th>Approx Expected value(INR)</th>
</div>
</tr>
</thead>
<tbody>
<tr>
<div class="form-group">
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="date"/></td>
<td><input type="date"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
</div>
</tr>
</tbody>
</table>
</div>
</div>
</form>
</div>
</div>
</body>
</html>
您可以尝试在您的和
回答
你需要用表中DIV带班表响应和不直接包裹，行类
here is demo
来源
2016-11-29 18:16:07 Chiller
谢谢。这有帮助，但我可以限制文本框大小的方式，我可以修复它本身，我不想它滚动 – Prathameshb7
你可以根据你需要设置文本框的最大宽度 – Chiller
什么尺寸的屏幕不适合？ Bootstrap 3有一个
.table-responsive类，可以添加到表中，允许在小于768px宽的设备上进行水平滚动。该文档是here。来源
2016-11-29 18:11:30
如果你想以适应屏幕保持桌面表格代码在具有类“col-md-8 col-md-offset-2” 的div中，并且如果表溢出屏幕，则可以使用类表响应作为表的父代。
来源
2016-11-29 18:16:19
[link] （http://codepen.io/piyush11388/pen/JbrgMB）检查这个演示 –
相关问题