Question

我花了好几天试图找到问题的解决方案。

我想将a或a对齐到我表格的特定列。

<table border="1" >
    <tr>
        <td>1.1</td>
        <td>1.2</td>
        <td>1.3</td>
    </tr>
    <tr>
        <td>2.1</td>
        <td>2.2</td>
        <td>2.3</td>
    </tr>
</table>
<div>Test</div>

我想将我的测试对准2.2细胞。

我正在使用Jquery。

你有什么想法吗？

Answer 1

DEMO 1 http://jsfiddle.net/YrHXF/（仅使用css）

如果您不想使用jquery增加CSS中的宽度 DEMO 2 http://jsfiddle.net/4Nzfr/

div,table{
    text-align:center;
    width:100px;
}

Answer 2

你需要包装你的表和那个div，然后定义宽度和text-align：

<div class="wrap">
<table border="1" >
    <tr>
        <td>1.1</td>
        <td>1.2</td>
        <td>1.3</td>
    </tr>
    <tr>
        <td>2.1</td>
        <td>2.2</td>
        <td>2.3</td>
    </tr>
</table>
<div>Test</div>
</div>

demo

Answer 3

只需使用<center>代码。为什么不编写额外的代码？：）

 <center>    
       <table border="1" >
            <tr>
                <td>1.1</td>
                <td>1.2</td>
                <td>1.3</td>
            </tr>
            <tr>
                <td>2.1</td>
                <td>2.2</td>
                <td>2.3</td>
            </tr>
        </table>
        <div>Test</div>
    </center>

或

<div class="container">
   <table border="1" >
        <tr>
            <td>1.1</td>
            <td>1.2</td>
            <td>1.3</td>
        </tr>
        <tr>
            <td>2.1</td>
            <td>2.2</td>
            <td>2.3</td>
        </tr>
    </table>
    <div>Test</div>
</div>

.container{
    text-align:center;
    display:table;
}

Answer 4

请在相应的CSS中设置样式，或者请使用：）

<div style="width:200px;">
    <table border="1" style="width:100%" >
        <tr>
            <td>1.1</td>
            <td>1.2</td>
            <td>1.3</td>
        </tr>
        <tr>
            <td>2.1</td>
            <td>2.2</td>
            <td>2.3</td>
        </tr>
    </table>
    <div style="text-align:center;">Test</div>
    </div>

Answer 5

您可以尝试关注fiddle

$(document).ready(function(){
  var position = $("#test").position();

  $("div").css({
    "left": position.left
  });  
});

将div与表列对齐

5 个答案: