这是之前发布的问题的延续:Center a table and align right a div。在上一个问题上,j08691 提供了一个完美的解决方案,可以将表格居中并右对齐 div。但是现在我遇到了 pageDiv 和 PageLinks 元素如果我将它们放在外部表中相互重叠的问题。例如,请参见:http: //jsfiddle.net/hockchailim/uECFg/4/。有没有办法自动扩展外部表以防止这种覆盖?
<table id="outerTable" border="1">
<tbody>
<tr>
<td>
<div id="pagingDiv" style="width:100%;">
<div id="goToPage" style="float:right"> Page 3 of 42 | Page#:
<input style="height:14px;width:21px;" /> <a href="#go">GO</a>
</div>
<table id="pageLinks" style="margin:auto;">
<tbody>
<tr>
<td> <a href="#first" title="Click to go to first page.">1</a>
</td>
<td> <a href="#first" title="Click to go to second page.">2</a>
</td>
<td> <a href="#first" title="Click to go to second page.">3</a>
</td>
<td> <a href="#first" title="Click to go to second page.">4</a>
</td>
<td> <a href="#first" title="Click to go to second page.">5</a>
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
<tr>
<td>
This is too short, <br/>
it caused goToPage and pageLinks <br/>
on previous cell is overlaying each other
</td>
</tr>
</tbody>
</table>