table doesn't fit on the screen. tried with most of the combination but doesn't work. amateur, help needed.

桌子不适合屏幕。尝试了大多数组合,但不起作用。业余的,需要帮助。

i don't know whats going wrong maybe some silly mistake and wasn't able to find any mistake

我不知道什么是错的可能是一些愚蠢的错误,并且无法找到任何错误

  <!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>

Display of tables isnt good below part is the problemtable 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>

3 个解决方案

#1


1

you need to wrap the table in div with a class table-responsive and dont wrap it directly to row class

你需要使用类表响应包裹div中的表,而不是直接将它包装到行类

here is demo

这是演示

更多相关文章

  1. 我可以在所有浏览器中使用我的屏幕外菜单吗?
  2. GET错误Glyphicon-halflings-regular.ttf / woff / woff2与来自L
  3. iis aspx常见错误 HTTP 错误 404 - 文件或目录未找到。
  4. 在HTML / PHP联系表单上出现404/405错误(链接问题?)
  5. Joomla 3.x“错误检出失败,出现以下错误:”没有更多信息
  6. 如何捕获PHP类型暗示的“可捕获的致命错误”?
  7. 尽管“SQL语法错误”消息仍然成功执行
  8. 使用curl加载xsl页面会返回实际的基数错误
  9. Yourphp系统发生错误

随机推荐

  1. Flask vs Django,Python Web 开发用哪个框
  2. 重磅!Github 私有仓库免费开放
  3. 【开发者必看】移动应用趋势洞察白皮书-
  4. VUE~~~table编辑列功能
  5. 不会时间序列预测?不要紧,大神来教你
  6. 12条经验,让你在机器学习的路上避免很多坑
  7. 全息金融行业数据安全解决方案
  8. 用两种非传统的爬虫,我把CSDN博主的底裤都
  9. Ansible 之 lineinfile 模块使用
  10. Python探索性数据分析,这样才容易掌握