CODEWITHSUNDEEP
htmlcss
Matt Morris
Matt Morris

Reputation: 11

Problems with CSS positioning

I have, for some reason extra white space at the bottom of my div name 'profile-stuff'. I can't seem to figure out why it is there. What could I be doing wrong.

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

My 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;
}

Upvotes: 0

Views: 63

Answers (3)

Steven
Steven

Reputation: 867

In your #cover-wrap, change your position to absolute and change the top -100px to 50px.

Should fix your problem.

Upvotes: 2

manoranjani.a
manoranjani.a

Reputation: 45

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

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

Upvotes: 1

Passerby
Passerby

Reputation: 10070

Alright, extending from comment:

Just as @Adrift has explained, position:relative elements still occupy the space they require, no matter how top/left/etc. offset they are assigned.

So to avoid this, change

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

to

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

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

Upvotes: 2

Related Questions