Question

如果使用相对位置将内容框保留在body容器中，为什么我使用的框与body标签的边框重叠？

这是html：

<body>

    <div class="content">
        <img src=""/>
    </div>

</body>

这是我的身体标签的css：

body { 
    font-family: Calibri;
    background-color: #e7e6e8;
    width: 100%;
    min-height:100%;
    min-width: 1200px;
    margin: 0; 
    padding: 0; 
    border: solid black 5px;
    }

这是制造麻烦的人：

.content {
    position: relative;
    width: 1325px;
    height: 300px;
    overflow: hidden;
    top: 45px;
    left: 7%;
    border: solid black 2px;}

Answer 1

您可以使用margin-top: 45px;代替top: 45px;。（另外，margin-left: 7%;也要在此处停止溢出。）

如果您相对放置元素，则始终在设置其父元素的高度/宽度之后这样做。 this answer.

中的更多内容

相对容器位置错误

1 个答案: