unable to position relative div using top & left attributes [closed]

开发者_如何学运维 This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center. Closed 10 years ago.

I am creating a simple website layout which contains

header,banner,col1,col2,footer

with in the #col2 I have created a div with id #main-image. The problem is this I am unable to position this div using top & left attributes. This div is with in #col2 and #col2 has float left attribute on it.

#main-image {
    width: 343px;
    height: 312px;
    background: #c4b17e;
    position: relatvie;
    z-index: 10;
    top: -100px;
    left: -148px;
}

---

Check the size of the containing div. You are inside of a containing div and thus if it is too small the contained div will not have any room to move.

When you have the containing div floating, most browsers will adjust the width the div so that it only takes up what is needed.

My recommendation: add a background color to #col2 such as #FF0000 which is red to see its width and height. If it is too small adjust the width #col2 to 800px or something like that.

Also fix the spelling of relative.

---

You spelt relative wrong. Try fixing that.

Hope this helps!
N.S.