html - CSS定位问题

Question

出于某种原因，我的 div 名称“profile-stuff”底部有额外的空白。我似乎无法弄清楚它为什么在那里。我可能做错了什么。

JSFIDDLE：http: //jsfiddle.net/8kvwC/

我的 CSS：

#profile-stuff {
    margin: 0px 0px 20px 0px;
    height: auto;
    width: 100%;
    box-shadow: rgba(0, 0, 0, 0.498039) 0px 6px 16px -9px;
    background-color: #fff;
}

Answer 1

在您的#cover-wrap中，将您的位置更改为绝对并将顶部更改-100px为50px.

应该解决你的问题。

Answer 2

好吧，从评论延伸：

正如@Adrift 解释的那样，position:relative元素仍然占据它们需要的空间，无论如何top/ left/etc。偏移它们被分配。

所以为了避免这种情况，改变

#cover-wrap {
    top:-100px;
    margin-bottom:-100px;
}

至

#cover-wrap {
    margin-top:-100px;
}

http://jsfiddle.net/8kvwC/3/

Answer 3

you can use that answer if u want the space for the bottom means you have to add

       div{
         float:left;
        margin-bottom:100px;
         }