Question

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Data Retrieve</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="bootstrap.css">
    <style>
        #demo{
          background-color:purple;
          color: white;
          width: 100%;
        }
        #home{
          width: 45px;
        }
        #back{
          width: 25px;
        }
        #header{
          width:100%;
        }
    </style>
</head>
<body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12 col-sm-12">
                <table id="info_table" class="table">
                    <tr>
                        <td id="header">
                            <p align="center"><span style="float: left"><a href="http://localhost/directory/BangladeshDirectory.html"><img src="back.png" id="back"></a></span><b>মন্ত্রণালয়</b><span style="float: right"><a href="http://localhost/directory/BangladeshDirectory.html"><img src="home.png" id="home"></a></span><span style="float: right"><a href="http://localhost/directory/montronaloy.html"><img src="refresh.png" id="refresh"></a></span></p>
                        </td>   
                   </tr>
                   <tr>  
                        <td id="demo" align="center"><td>
                   </tr>
                </table> 
            </div>
        </div>      
    </div>
</body>
</html>  
<script>
    var bn_num = new Array('০','১','২','৩','৪','৫','৬','৭','৮','৯');

    function bn_num_convert(num){
        //console.log(num.length);
        var bn_val = '';
        for(i=0;i<num.length;i++){
          //console.log(num[i] + '/' + bn_num[num[i]]);
          bn_val = bn_val + bn_num[num[i]];
        }
        //console.log(bn_val);
        return bn_val;
    }
    $.getJSON("http://localhost/directory/ministri.json",function(obj){
        var info ='';
        //alert(obj.data.length);
        var count = obj.data.length;
        document.getElementById("demo").innerHTML ='মোট মন্ত্রণালয় ('+bn_num_convert(count.toString())+')';
        var count = obj.data.length;
        $.each(obj.data,function(key,value){

            info += '<tr>';
            info +='<td><a href="http://localhost/directory/show.php?id='+value.id+'" style="text-decoration:none">'+value.sitename_bn+'<span style="float: right"> > </span>'+ '</a></td>';
            info += '</tr>';
[This is the corresponding output of the code.][1]
        });

           $('#info_table').append(info);
    });
</script>

首先，这里的紫色背景色没有达到全宽。如果我检查背景，则显示一个空的td会引起问题。如果我删除了一个空的td，则得到了理想的结果。但是其中没有空的td我的code.plz看到代码并显示错误。其次，输出结果的末尾没有水平线。为什么最后一行没有水平线？

Answer 1

您没有关闭td，这就是为什么要添加空td的原因。

 <td id="demo" align="center"></td>

像上面的代码一样关闭td

并删除其他建议的边距和填充，以防万一您想要全宽直到结束。

Answer 2

将正文边距填充设置为0px

ini_set('memory_limit', '4096M');

Answer 3

只需将 放在演示ID td中，它将显示。

See this https://jsfiddle.net/v6mwpz89/3/

干杯！

Div无法获取页面的完整宽度

3 个答案: