Question

我正在创建一个网站，其中包含一个带有绝对定位div的页面。我使用的技术是CSS布局，Bootstrap框架，角度2。

我现在面临的问题是我需要绝对放置一些div。它们放在容器内。结构看起来像这样：

<div class="container">
    <div class="myowncontainer">
        ... some stuff at the beginning ...

        <div class="absolutecontainer col1 row1">
            ... content ...
        </div>

        ... more of the absolute containers ...
    </div>
</div>

CSS：

.myowncontainer
{
    width: 2600;
    height: 700;
}

.absolutecontainer
{
    position: absolute;
}

.col1
{
    left: 5px;
}

.row1
{
    top: 5px;
}
... and other rows and columns ...

在你问我为什么不使用bootstrap功能来构建表之前，col1和row1不能显示为表。如果你熟悉运动，我需要展示双KO系统，每个绝对定位的div都是一个匹配。它无论如何都不会形成一张表。

那么，是什么让它变得困难：当我绝对放置div时，它们会溢出容器div。我想将它们放在容器中。我也尝试了一些相对定位，但失败了。总有一些事情使得正确定位div非常困难或不可能。

实际问题：

在chrome中，myowncontainer不具有指定的宽度和高度，绝对定位的div触及页面边缘，即使myowncontainer较大以提供一些空间。其他浏览器工作正常（firefox，edge）。
绝对定位在PAGE的左上角有0,0点，而不是父DIV。所以绝对的div正在将容器溢出到顶部和左侧。也许应该使用相对定位，但是如何指定相对于WHAT？我的意思是，当这个片段也是一个组件时，angular 2会在代码片段周围放置一些标签。我不想将它相对于此生成的标记放置。
最糟糕的是，在android的Chrome中根本没有显示内容。绝对的div完全没有了。我还没有检查过其他浏览器，当最常用的浏览器根本不工作时对我没用。

当然我知道这样的页面的响应性会很差，但这是用户必须接受的，这不是一个常见的页面，它是一个很大的概述，我可以完全按照我想要的方式放置。它也是整个系统中唯一没有响应的页面。所以，如果你知道我应该如何放置div，不要关心责任......或者是否有任何办法？我不这么认为:)我相信一切都可以通过一个简单的技巧来解决，可能是相对定位......但是如何？网站在线（仍未使用），如果需要，我可以私下发送URL。

感谢所有人提前。

在bootstrap容器中定位的正确方法

0 个答案: