【问题标题】:td tag content is not aligned to righttd 标签内容未右对齐
【发布时间】:2012-03-25 04:23:33
【问题描述】:

我有一个包含两列的一行表格。我想将第二列的内容向右对齐...我的内容没有向右对齐..你能检查一下那里有什么问题...... .

这是我的代码....

<html><head>                                                                                                                             
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="content-style-type" content="text/css">                                                                                                                <style>

 table td{
 border:1px solid green;
 }

 #Paginator ul{ margin:0px;padding:0px;}
 #Paginator ul li{ font-family::Arial,Tahoma,helvetica,sans-serif;font-size:9pt;list-style:none;float:left;margin:2px;padding:4px 8px 2px 8px;border:1px solid     black;cursor:pointer;}
 #Paginator ul li,#PrevPage{display:none;}
 </style>     

<body>

 <table style="border:1px solid red;width:100%"><tr>
  <td>
    <b style="float:left;">Number of Matching Addresses:&nbsp; 49 &nbspNumber of pages:  5</b>
 </td>

 <td align="right">

 <script>

 var ga_pageId = new Array();
 function pageNavigate(){if(document.getElementById("FromPage")){ var fromPage  = parseInt( document.getElementById("FromPage").value);} if(document.getElementById("ToPage")){var toPage =  parseInt( document.getElementById("ToPage").value);}if(fromPage == 1){document.getElementById("PrevPage").style.display="none";} else{ document.getElementById("PrevPage").style.display="inline"; }if(toPage == 5  || toPage<5){document.getElementById("NextPage").style.display="none";}else{ document.getElementById("NextPage").style.display="inline"; }for(var j=0;j<ga_pageId.length;j++){if(document.getElementById(ga_pageId[j])){document.getElementById(ga_pageId[j]).style.display="none"}}for(var i=fromPage;i<=toPage; i++){ var pageId = 'PAGE_'+i;if(document.getElementById(pageId))document.getElementById(pageId).style.display="inline"; }}

 function previousPage(){var fromPageEle = document.getElementById("FromPage");var toPageEle = document.getElementById("ToPage");if(fromPageEle && toPageEle){fromPageEle.value = parseInt(fromPageEle.value) - 1;toPageEle.value =  parseInt(toPageEle.value) - 1;pageNavigate();}}

 function nextPage(){var fromPageEle = document.getElementById("FromPage");var toPageEle = document.getElementById("ToPage");if(fromPageEle && toPageEle){fromPageEle.value = parseInt(fromPageEle.value) + 1;toPageEle.value =  parseInt(toPageEle.value)  + 1; pageNavigate();}}

 function pageOver(lv_this){if(lv_this.selected!='X')lv_this.style.backgroundColor = "#52CFCF";}
 function pageOut(lv_this){if(lv_this.selected!='X')lv_this.style.backgroundColor = "#E6EFFA";}

 </script>

   <div id="Paginator">
   <input type="hidden" id="FromPage" value="1"/>
   <input type="hidden" id="ToPage" value="5 "/>
    <ul > 

      <li onClick="previousPage()" id="PrevPage"><span>PREV</span></li>
      <script> ga_pageId.push('PAGE_1');</script>

      <li id="PAGE_1">1 </span></li>
      <script> ga_pageId.push('PAGE_2');</script>

      <li id="PAGE_2" >2 </span></li>
      <script> ga_pageId.push('PAGE_3');</script>

      <li id="PAGE_3" >3 </span></li><script> ga_pageId.push('PAGE_4');</script>

      <li id="PAGE_4">4 </span></li>
      <script> ga_pageId.push('PAGE_5');</script>

      <li id="PAGE_5">5 </span>
      </li>
      <li onClick="nextPage()" id="NextPage" style="display:none"><span>NEXT</span></li>
     </ul> </div>

 <script> pageNavigate()</script>

  </td>
  </tr>
</table>

</body></html>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              

【问题讨论】:

  • 不要发布无用 JavaScript 的坚固墙。发布页面的核心详细信息/布局。无论如何,那个html是一团糟。您不应该在表格单元格中嵌入脚本,并且无论如何都不推荐在标签中使用align。为什么不&lt;td style="text-align: right"&gt;
  • @Rama 你得到答案了吗?这是你要找的还是别的什么?

标签: html alignment html-table


【解决方案1】:

添加这个css:

 #Paginator ul{ margin:0px;padding:0px; float:right;}

【讨论】:

    【解决方案2】:

    您在之前的&lt;TD&gt; 标签style="float:left;" 中已经有了答案。 为什么第二个&lt;TD&gt; 不使用相同的?

     You can use the Following options
        1. <td style="float:right;">
        2. <div id="Paginator" style="float:right;" >
        3. #Paginator ul{ margin:0px;padding:0px; float:right;}
    

    【讨论】:

      【解决方案3】:

      因为您的内容包含在 div 中。 div 扩展为td 的大小,其中的内容左对齐。在 Paginator ul li 样式中添加text-align: right

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2012-08-26
        • 1970-01-01
        • 2016-11-15
        • 1970-01-01
        • 2012-11-23
        • 2012-07-27
        相关资源
        最近更新 更多