Question

HTML

<center>
    <table>
    <tr>
        <td>
            <div id="test_1">
                <div id="test_2">
                    <span id="test_3">[+]</span>
                    Test Test Test
                </div>
            </div>
        </td>
    </tr>
    </table>
</center>

这是我的测试代码：

这是测试 CSS ：

div[id*='test_1'] {
    position: relative;
    width: 550px;
    background-color: #A4A4A4;
    margin: auto;
    border: 2px solid black;
    padding: 0px;

}
span[id*='test_3'] {
    position: absolute;
    cursor: pointer;
}
td {
    text-align: center;
}

这是jfiddle：

http://jsfiddle.net/1q7zuq16/1/

[+]应该是左边的，而文本居中。

如果你在Firefox，Chrome，Opera中打开那个jfiddle，那么[+]就会超过这个词。如果你在IE中打开它，它可以正常工作。

我最常使用IE，所以我想知道我能用不同的代码来制作绝对定位的跨度，转到它所在的div的最左边，而不是与文本对齐。

Answer 1

您没有为绝对位置定义顶部或左侧值。默认情况下，它们的值设置为auto。

span#test_3 {/* attribute selector removed (optional - as it is just test_3 nothing more) */
    position: absolute;
    top: 3px;/*put your value*/
    left: 10px;
    cursor: pointer;
}

Answer 2

为什么不向左浮？

span[id*='test_3'] {
    /*position:absolute;*/
    float:left;   
    cursor: pointer;
}

http://jsfiddle.net/1q7zuq16/2/

IE浏览器只使用绝对定位权？

2 个答案: