Question

我正在使用引导程序表来显示我的数据，它在Google Chrome上运行正常，但在Firefox上无法正常工作。

这就是我在谷歌浏览器上看到的内容。这就是我在 firefox 上看到的内容。

这是我的代码

echo<<<EOF
  <div class="x_content">
     <table id="example" class="table table-bordered table-hover" style='font-size:13px;'>
                                    <thead>
                                        <tr height="10">
                                            <th class="col-sm-1">#</th>
                                            <th class="col-sm-8">Leave Category</th>
                                            <th>Is Active </th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                     <tbody>

EOF;
$this->fetch(); //this is the function to get data from database
echo<<<EOF
      </div>
    </div>
    </div>
EOF;

javasript

<script>

        var asInitVals = new Array();
        $(document).ready(function () {
            var oTable = $('#example').dataTable({
                "oLanguage": {
                    "sSearch": "Search all columns:"
                },
                "aoColumnDefs": [
                    {
                        'bSortable': false,
                        'aTargets': [0]
                    } //disables sorting for column one
        ],
                'iDisplayLength': 12,
                "sPaginationType": "full_numbers"
            });
            $("tfoot input").keyup(function () {
                /* Filter on the column based on the index of this element's parent <th> */
                oTable.fnFilter(this.value, $("tfoot th").index($(this).parent()));
            });
            $("tfoot input").each(function (i) {
                asInitVals[i] = this.value;
            });
            $("tfoot input").focus(function () {
                if (this.className == "search_init") {
                    this.className = "";
                    this.value = "";
                }
            });
            $("tfoot input").blur(function (i) {
                if (this.value == "") {
                    this.className = "search_init";
                    this.value = asInitVals[$("tfoot input").index(this)];
                }
            });
        });
    </script>

如何更改css才能正常工作？

Answer 1

使用内置网格时，Bootstrap具有依赖性。

<div class="container"> <!-- It can be either container or container-fluid -->
 <div class="row"> <!-- Similar to the upper one -->
  <div class="col-md-12"> <!-- col-xs-*, col-md-*, col-lg-* -->
   ...
  </div>
 </div>
</div>

检查Bootstrap文档，尤其是网格：Bootstrap

引导表显示GoogleChrome和Firefox之间的不同

1 个答案: