Question

嗨我正试图将一个div放置在受此启发的TD内部div的左上角 question旨在帮助在TD中定位元素。我无法让它发挥作用。我想这可能是因为我有填充。如果你可以帮助我获取我的代码中的“目标”元素到TD的左上角，这将是很好的方法。

我尝试了TD的内部包装器的宽度和高度，看起来高度只是文本。我想我希望内包装的高度与TD相同，因此可以将目标div放在角落里。我听说你不能在TD中定位

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>table</title>
    <style>
        td,th{
            padding: 20px 30px;
        }
        .innerWrapper{
            position:relative;
        }
        .target{
            position: absolute;
            top:0;
            left: 0;
            background-color: blue;
        }
        td:nth-child(1){
            background-color: yellow;
        }
    </style>
    <script  src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
    <table>
        <tr>
            <th>one</th>
            <th>two</th>
            <th>three</th>
            <th>four</th>
        </tr>
        <tr>
            <td><div class = "innerWrapper">td1<div class = "target">T</div></div></td>
            <td>td2</td>
            <td>td3</td>
            <td>td4</td>
        </tr>
    </table>
        <script>
            $(document).ready(function(){
                tdh = $('td:nth-child(1)').outerHeight()
                alert("td"+ tdh);
                var inner = $('.innerWrapper').outerHeight(tdh);
                alert(inner);
            });
        </script>
</body>
</html>

JsFiddle 我试图制作一个脚本来将内部包装器设置为与TD相同的高度，但这不起作用，我想知道为什么。如果你也可以提供帮助那就太好了。

Answer 1

您需要将填充从单元格移动到包装器中（或适当地偏移目标部分）。

使用绝对位置定位TD的子项

1 个答案: