0

当我尝试将元素作为静态 html 文本放置时，一切正常，但是当我尝试在运行时（来自服务器的数据数组）中放置元素时，我遇到定位为absolute. 最简单的重现示例

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>Positioning</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style type="text/css">
        body { font-family: Verdana, Tahoma, sans-serif; font-size: 14px }
        div { border: 1px solid black }
        .div5 { float: left; width: 300px; height: 300px; }
        .div6 { width: 100px; height: 100px; position: absolute; top: 50px; left: 50px; background-color: #F5D8C1 }
        .div9 { width: 20px; height: 20px; position: absolute; bottom: 20px; left: 20px; background-color: #D8F5C1 }
    </style>
</head>
<body>
    <div id="content"></div>
    <script type="text/javascript" language="JavaScript">
        function setDivValue($divId, $value)
        {
            var divL = document.getElementById($divId);
            if (divL)
                divL.innerHTML = $value;
        }

        var rtext = "<h1>Position absolute test</h1>";
        for (var i = 0; i < 10; i++){
            rtext +=    "<div class='div5' id='" + i + "'>" +
                            "<div class='div6'>div6</div>" +
                            "<div class='div9'>div9</div>" +
                        "</div>";
        }
        setDivValue("content", rtext);
    </script>
</body>
</html>

它不是通过父元素 div5 放置 div6 和 div9，而是在 FF 20 和 IE 8 中定位到窗口（所以这似乎不是与浏览器相关的错误）。

有可能解决吗？例如，我需要将图片放置到 div6 并将文本放置到图片左上角（内部）的 div9 上。

4

1 回答 1

1

尝试添加这些 CSS：

#content{position:relative;}
于 2013-05-13T17:58:22.973 回答